动态附加事件处理程序
我正在将一个事件处理程序附加到一个表格单元格。单击search按钮后，将生成该表。搜索按钮还会生成一个链接，当单击该链接时，会打开一个模式弹出窗口，其中包含另一个表。模式弹出窗口中的表也应该具有附加到其单元格的相同事件处理程序。
这样做可以吗：
$(document).on('mouseenter mouseleave', '.cell-with-action', function(e){
var action = $(this).find('.action');
if(e.type == 'mouseenter'){
//do something
}
else{
//do something else
}
});或者当搜索按钮和链接按钮被点击时附加它更好？这样做会有什么不同：
$('.table-with-action').on('mouseenter mouseleave', '.cell-with-action', function(e){
var action = $(this).find('.action');
if(e.type == 'mouseenter'){
//do something
}
else{
//do something else
}
});谢谢。
回答 2
Stack Overflow用户
发布于 2013-06-19 16:11:46
这两个选项(针对您的问题，而不是您的代码)之间的主要区别在于，与单击search按钮时相比，第一个选项将在加载文档时加载。
在加载文档时这样做的好处是，您不必像在搜索单击时那样，在附加文档之前检查它是否已加载，因为每次单击都会附加一个新事件&因此，当事件被触发时，您将多次调用同一函数。
如果你有一个快速加载的页面(即不是很大/动态的)，那么使用第一个选项是有意义的。否则，请使用第二个IMO。
至于您的代码:第一个代码片段附加到文档，而第二个代码片段附加到表。因此，根据您拥有的这些表的数量，您可能会以冲突告终。此外，使用更具体的选择器.table-with-action，事件不必像操作$(document)那样在DOM树上冒泡那么远。更重要的是，不相关元素上的事件根本不会到达处理程序，这意味着jQuery不必过滤不相关的事件(如Jan所指出的)。
您可能还想返回false或使用e.stopPropagation或e.stopDefault，这取决于您的需求。
Stack Overflow用户
发布于 2013-06-19 16:09:23
您应该可以使用第一个示例，但是出于性能原因，您可能希望将事件处理程序添加到<body>元素而不是文档，并使用元素类型(即'table td.cell- with -action')限定类。
https://stackoverflow.com/questions/17185960
复制相似问题
腾讯云开发者
