ulの各liテキストの色を確認するにはどうすればよいですか？

変更ボタンをクリックすると、<li>のテキストの色を1つずつ変更したいと思います。 <li>のテキストがすべて赤になると、「all li text color changed！」というアラートメッセージが表示されます。ulの各liテキストの色を確認するにはどうすればよいですか？

私のhtmlコードは次のとおりです。

<html> 
    <body> 
    <button id="change">change li text-color</button> 
    <ul id="nav"> 
     <li>one</li> 
     <li>two</li> 
     <li>three</li> 
     <li>four</li> 
     <li>five</li> 
     <li>six</li> 
     <li>seven</li> 
    </ul> 
    </body> 
</html>

と私のスクリプトは（jQueryのv1.5.2）である：

$(document).ready(function() 
{ 
    $('#change').click(function() 
    { 
    $('#nav li').each(function() 
    { 
     $(this).css('color', '#F00'); 
    }); 
    }); 
});

出典

2011-12-08 Suresh Pattu

？コードは細かいです –

@RoyiNamir too localized –

私は最初にliをクリックしたときのようにliの色を1つずつ変更したいと考えています。 –

私はあなたが色ごとのクリックで一つずつを変更したいと思います。カウンターを追加します。

$(document).ready(function() 
{ 
    var len = $('#nav li').length, 
     cnt = 0; 
    $('#change').click(function() 
    { 
    if (cnt < len) 
    { 
     $('#nav li:eq('+cnt+')').css('color', '#F00'); 
     cnt++; 
    } else { 
     alert("all li text color changed!"); 
    } 
    }); 
});

デモ：ここでいただきました！間違っhttp://jsfiddle.net/SUtED/

出典

2011-12-08 08:47:35 ezakto

すごくうれしい –

ulの各liテキストの色を確認するにはどうすればよいですか？

答えて

関連する問題