2017-09-01 74 views
0

我發現了一個jQuery隨機顏色函數的某處在stackoverflow,但我需要調整這一點,以便任何元素有類添加到它,整個部分將是相同的顏色,而不是每個詞都是隨機的顏色。隨機顏色生成器(全部,不只是一個單詞)

// any valid css colours 
 
var colors = ["#FF0000", "#FFC0CB", "#C71585", "#FFA500", "#FF4500", "#FFFF00", "#800080", "#4B0082", "#00FF00", "#2E8B57", "#808000", "#008080", "#00FFFF", "#0000FF", "#DAA520", "#800000", "#00BFFF"]; 
 

 
\t $('.colortxt').html(function (i, text) { 
 
\t \t return $.map(text.split(' '), function (word) { 
 
\t \t \t return '<span style="color:' 
 
\t \t \t \t + colors[Math.floor(Math.random() * colors.length)] 
 
\t \t \t \t + '">' + word + '</span>'; 
 
\t \t }).join(' '); 
 
\t });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<h1 class="colortxt"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod</h1>

回答

1

刪除map方法分割字符串轉換成文字和apllies變色功能,每一個字

// any valid css colours 
 
var colors = ["#FF0000", "#FFC0CB", "#C71585", "#FFA500", "#FF4500", "#FFFF00", "#800080", "#4B0082", "#00FF00", "#2E8B57", "#808000", "#008080", "#00FFFF", "#0000FF", "#DAA520", "#800000", "#00BFFF"]; 
 

 
\t $('.colortxt').html(function (i, text) { 
 
\t \t return '<p style="color:' 
 
\t \t \t \t + colors[Math.floor(Math.random() * colors.length)] 
 
\t \t \t \t + '">' + text + '</p>'; 
 
\t \t });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<h1 class="colortxt"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod</h1>

+0

完美!非常感謝! – xxdash