Jquery .on with doubleclick事件

Question

为什么这样做:

$(document).on("dblclick", "#areaA tr:has(td)", function(e) {
     //code here
 });

而这不是

$("#areaA tr:has(td)").on('dblclick', function(e) {
    //Code here
});

我正在关注jquery文档页面上的示例,但我的双击不会触发.当我第一次这样做时,它可以工作,但似乎它会两次触发事件.

这是在Kendo UI网格的上下文中.

这两段代码之间真的有区别吗？

Answer 1

主要区别在于每次单击时都会检查第一个中的条件.因此,如果动态添加id areaA或or tr或tdinside 的元素,则只能使用第一个元素.

Answer 2

您描述的第一个方法之所以有效，是因为您选择了一个静态父对象，然后是一个动态子对象，它遵循使用.on方法将事件绑定到动态创建的元素的规则。

这是该.on方法的语法，听起来您已经做了一些研究。

$(selector).on(event,childSelector,data,function,map)

因此，如果要使用绑定到动态元素.on，则必须先用美元符号选择一个静态父元素，然后在.on方法内部选择动态子元素。在您的情况下，正确的用例将像这样工作：

$("body").on('dblclick', '#areaA tr:has(td)', function(e) {
    //Code here
});

既然您提到它没有用，我假设#areaA它不是静态元素。您可以将body替换为更相关的静态元素，也可以只保留body，这并不重要。