Question

我正在使用这个jquery脚本：

$(document).ready(function(){

    //Fix Errors - http://www.learningjquery.com/2009/01/quick-tip-prevent-animation-queue-buildup/

    //Remove outline from links
    $("a").click(function(){
        $(this).blur();
    });

    //When mouse rolls over
    $("li").mouseover(function(){
        $(this).stop().animate({height:'80px'},{queue:false, duration:600, easing: 'easeOutBounce'})
    });

    //When mouse is removed
    $("li").mouseout(function(){
        $(this).stop().animate({height:'220px'},{queue:false, duration:600, easing: 'easeOutBounce'})
    });

});

HTML：

<div id="nav1" class="top_nav" style="position:absolute; left:80px;">
    <ul>
        <li class="green">
            <p><a href="#"></a></p>
        </li>
    </ul>

问题：我的问题是：上面的jquery脚本应仅适用于ID为“nav1”的div。但它适用于我在页面中使用的所有“li”

Answer 1

使用此选项将Jquery应用于具有 ID “nav1”

的Div

   $("#nav1 li").click(function(){});

Answer 2

如果您选择$('li')，它会选择您现在所了解的页面上的所有列表项，而不是在div <li>中定位#nav1，如下例所示

$("#nav1 li").mouseover(function(){...

其他信息 - jQuery Child Selector

仅在特定标记上应用jquery脚本

2 个答案: