2012-04-26 34 views
2

私の人生のためにこれを理解することはできません。私は7つのクラス(曜日に基づいて)の7つのクラスを与えなければなりません。.past、.today、および.future条件付き.addClass()

私は.todayを素早く.getDay()、私は、トラブルのすべての割り当てを持っています.todayが.pastする前に来て、すべての.todayの後に来る李さんは.futureに対するLiの

HTML:

<ul class="days-of-the-week tabs clearfix"> 
    <li class="sunday"><span><a href="#">Sunday</a></span></li> 
    <li class="monday"><span><a href="#">Monday</a></span></li> 
    <li class="tuesday"><span><a href="#">Tuesday</a></span></li> 
    <li class="wednesday"><span><a href="#">Wednesday</a></span></li> 
    <li class="thursday"><span><a href="#">Thursday</a></span></li> 
    <li class="friday"><span><a href="#">Friday</a></span></li> 
    <li class="saturday"><span><a href="#">Saturday</a></span></li> 
</ul> 

のjQuery:

// Add class .today to the correct day-of-week tab 
$('ul.days-of-the-week li:eq(' + new Date().getDay() + ')').addClass('today'); 

ありがとうあらかじめ!

答えて

4

prevAll()を使用すると、現在の要素の前のすべての兄弟を取得できます。nextAll()は、次のすべての兄弟に対して取得できます。 prevAllため

ドキュメント:http://api.jquery.com/prevAll/

nextAllのためのドキュメント:それは簡単ですこれらを使用してhttp://api.jquery.com/nextAll/

。 JSFiddle:http://jsfiddle.net/qYt2p/

var today = $('ul.days-of-the-week li:eq(' + new Date().getDay() + ')').addClass('today'); 
today.prevAll().addClass("past"); 
today.nextAll().addClass("future");​ 
+0

非常にうまく動作します。 +1 –

+0

あなたは大歓迎です:) –

1

私はあなたがnetxAllとprevAllを探していると思う:

var today = $('ul.days-of-the-week li:eq(' + new Date().getDay() + ')'); 
today.prevAll().addClass('past'); 
today.addClass('today'); 
today.nextAll().addClass('future'); 
+0

なぜCOPYの回答ですか? – Starx

+0

prevAllには括弧がなく、コードにはnextAllがまったくありません。 – Starx

+0

Starx:彼の答えを入力する際に​​ジャックが私よりもはるかに速いので、私が入力を開始したときは何もありませんでした。不足している括弧を修正しました。 –

0
$('ul.days-of-the-week li').each(function() { 
    var c = new Date().getDay() <= $(this).index() ? new Date().getDay() == $(this).index() ? 'today' : 'future' : 'past'; 
    $(this).addClass(c); 
});