如何添加隨機類到鏈接列表

Question

我有以下結構。

<ul id="dyn_nav"> 
    <li><a href="#">Home</a></li> 
    <li><a href="#">Services</a></li> 
    <li><a href="#">Contact</a> 
     <ul class="submenu"> 
      <li><a href="#">Home</a></li> 
      <li><a href="#">Services</a></li> 
      <li><a href="#">Contact</a></li> 
     </ul> 
    </li> 
</ul> 

li（ul＃dyn_nav> li）的第一級應該從給定列表中獲得隨機類。

類是藍色，綠色，洋紅色，青色，紅色等..

我想使這個菜單動態色彩不固定的。

像一個可以有第一個菜單顏色綠色，另一個有藍色。這只是我的想法。

jQuery請。

Answer 1

$(document).ready(function() { 
    var classes = ['blue', 'green', 'magenta', 'cyan', 'red']; 
    $('ul#dyn_nav>li').each(function(i) { 
     $(this).addClass(
      classes[Math.floor(Math.random()*classes.length)]); 
    }); 
}); 

我還添加了ul#dyn_nav>li>a { color: inherit; }樣式表使顏色會影響到li的鏈接，而不僅僅是子彈。

Answer 2

將你的顏色放到一個數組中，randomize it，並使用jQuery.each和addClass來分配值。

Answer 3

Dutow是對的。 @Wazdesign：您也可以嘗試這個片段：

function rand(){ return (Math.round(Math.random())-0.5); } 
    var colors = new Array('blue','yellow','red','green');//you can add more class here 
    var init = colors.sort(rand); 
    $('ul li').each(function(i,el){ 
    $(el).addClass(init[i]); 
    });