日期:2014-05-16  浏览次数:20450 次

请教关于jquery关于UL获取LI的问题。
HTML是这样的

<div id="div1">
<ul class="slice-piece">
    <li>a0 (-9)</li>
    <li>a1 (-8)</li>
    <li>a2 (-7)</li>
    <li>a3 (-6)</li>
    <li>a4 (-5)</li>
    <li>a5 (-4)</li>
    <li>a6 (-3)</li>
    <li>a7 (-2)</li>
    <li>a8 (-1)</li>
</ul>
<ul class="slice-piece">
    <li>b0 (-9)</li>
    <li>b1 (-8)</li>
    <li>b2 (-7)</li>
    <li>b3 (-6)</li>
    <li>b4 (-5)</li>
    <li>b5 (-4)</li>
    <li>b6 (-3)</li>
    <li>b7 (-2)</li>
    <li>b8 (-1)</li>
</ul>
</div>


我希望当鼠标移动到第二个UL中的第三个LI标签的时候,能够隐藏第二个UL其他所有LI标签,只显示鼠标所在的第三个LI标签。
不知道JQUERY应当用什么办法实现呢?麻烦各位大侠了!
jquery

------解决方案--------------------

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/JavaScript">
$(function(){
$(".slice-piece1 li:nth-child(3)").mouseover(function(){ $(".slice-piece1 li").not($(this)).hide();});
//$(".slice-piece1 li:nth-child(3)").mouseout(function(){ $(".slice-piece1 li").not($(this)).show();});//这句是鼠标移开元素恢复,要不要你自己看着办吧
})
</script>
<div id="div1">
<ul class="slice-piece">
    <li>a0 (-9)</li>
    <li>a1 (-8)</li>
    <li>a2 (-7)</li>
    <li>a3 (-6)</li>
    <li>a4 (-5)</li>
    <li>a5 (-4)</li>
    <li>a6 (-3)</li>
    <li>a7 (-2)</li>
    <li>a8 (-1)</li>
</ul>
<ul class="slice-piece1">
    <li>b0 (-9)</li>
    <li>b1 (-8)</li>
    <li>b2 (-7)</li>
    <li>b3 (-6)</li>
    <li>b4 (-5)</li>
    <li>b5 (-4)</li>
    <li>b6 (-3)</li>
    <li>b7 (-2)</li>
    <li>b8 (-1)</li>
</ul>
</div>

------解决方案--------------------
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/JavaScript">
    $(function(){
        $(".slice-piece1 li:eq(2)").hover(function(){
            $(".slice-piece1 li").not($(this)).ani