jQuery on / delegate正确的语法

Question

由于jQuery API目前已关闭，是否有人能够协助我使用以下内容？我是ajax将无序列表加载到网页中，并且需要能够将悬停和点击事件附加到列表项。

<ul>
  <li class="option">Item 1</li>
  <li class="option">Item 1</li>
  <li class="option">Item 1</li>
</ul>

到目前为止，我已尝试使用.on for version 1.7 +

的以下jQuery代码的一些变体

$("ul").on("click", "li .option", function(){
alert($(this).text());
}); 

有人能指出我正确的方向吗？我知道.live已被折旧，并且.delegate已被取代，所以实际上只是寻找一个允许我使用.on的解决方案。

一如既往地谢谢！

Answer 1

不是li .option，因为它在li中找到了包含option类的元素，但是您将此类添加到li，因此它将是li.option或.option。

因此对于.on()，它看起来像是：

$("ul").on("click", "li.option", function(){
   alert($(this).text());
});

但对于.delegate()，它看起来像：

$("ul").delegate("li.option", "click", function(){
   alert($(this).text());
});

根据你编辑

您正尝试将click与li.option绑定到容器引用ul，该容器引用也附加到DOM alter。所以你可以去#content，它已经存在于DOM ans中你附加整个列表。

所以委托事件将如下：

$("#content").delegate("ul > li.option", "click", function(){
   alert($(this).text());
});