Question

请让我知道以下几点之间的区别。

我是这种行为的新手。

 $('#myButton').on('click', function () {
            // Some code
        });

和

$(document).on('keyup', '#myButton', function () {
    // Some Code
});

和

$('#myButton').click(function () {
    //Some code
});

Answer 1

来自documentation

委托事件的优势在于它们可以处理来自稍后添加到文档的后代元素的事件。通过选择在附加委托事件处理程序时保证存在的元素，您可以使用委派事件来避免频繁附加和删除事件处理程序的需要。例如，此元素可以是模型 - 视图 - 控制器设计中视图的容器元素，如果事件处理程序想要监视文档中的所有冒泡事件，则可以是文档。在加载任何其他HTML之前，文档元素在文档的头部可用，因此可以安全地将事件附加到那里而无需等待文档准备就绪。

在其tbody中包含1,000行的数据表中，此示例将处理程序附加到1,000个元素：

$( "#dataTable tbody tr" ).on( "click", function() {
  alert( $( this ).text() );
});

委托事件方法只将一个事件处理程序附加到一个元素tbody，而事件只需要冒出一个级别（从点击的tr到tbody）：

$( "#dataTable tbody" ).on( "click", "tr", function() {
  alert( $( this ).text() );
});

注意：委派事件不适用于SVG。

另见：

$（document）.on和$（'＃submit'）之间的区别

1 个答案: