1

私はli要素を持っています

<ul class="">

        <li class="current-rating" id="current-rating" style="width: 0px"></li>

        <li><a href="#" title="1 star out of 5" class="one-star star star-rating stars-1">1</a></li>

        <li><a href="#" title="2 star out of 5" class="two-stars star star-rating stars-1">2</a></li>

        <li><a href="#" title="3 star out of 5" class="three-stars star star-rating stars-1">3</a></li>

        <li><a href="#" title="4 star out of 5" class="four-stars star star-rating stars-1">4</a></li>

        <li><a href="#" title="5 star out of 5" class="five-stars star star-rating stars-1">5</a></li>

   </ul>

マウスオーバーして 3 と言うと、どうすればすべての要素を DOM に上げることができますか? つまり、3番目のliをクリックまたはマウスオーバーすると、3つのliが必要になります。5 番目にマウスを合わせると、5 つすべてが表示されます。parent() とparent() を使用して試しましたが、動作しませんでした。

4

1 に答える 1

4

jsBin デモ

評価システムに使用.prevAll().andSelf()するだけです。トリックを行うことができました。

http://api.jquery.com/prevall
http://api.jquery.com/andself

ただし、元のセレクターを維持したい場合は、 : .andSelf()like:と組み合わせて使用​​することに注意してください。

$('li').hover(function(){
   $(this).prevAll().andSelf().css({background: 'gold'});
},function(){
   $(this).prevAll().andSelf().css({background: '#eee'});
});

clickスワップクラスのトリックと魔法を行うのはあなたに任せます。必要なものはすべて揃っています。

于 2012-07-05T20:32:27.313 に答える