2017-09-01 75 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