jQuery:为什么我的 li 元素上的单击事件不起作用？

Question

我想在单击 li 元素时移动 Div 元素“nav”。

我在 div 中有一个列表

<div id="nav">
    <ul>
        <li><a href="#t1">Flyer</a></li>
        <li><a href="#t2">Code</a></li>
        <li><a href="#t3">Angebot</a></li>
        <li><a href="#t4">Bilder</a></li>
    </ul>
</div>  

为什么这在 jquery 中不起作用:

$("#nav ul li").click(function(){
    $("#nav").animate({ 
        marginLeft: "-300px",
    }, 1000 );
});

Answer 1

根据您使用的 Jquery 版本，这可能有效，也可能无效:

$('body').on('click', '#nav ul li', function(){
    $("#nav").animate({ 
        marginLeft: "-300px",
    }, 1000 );
});

我做了 $('body') 因为如果您动态生成这些 li，那么您需要在调用“委托(delegate)事件”时绑定(bind)它们。