事件传播事件绑定答案

【问题标题】：event propagation event binding [duplicate]事件传播事件绑定
【发布时间】：2017-07-05 09:27:30
【问题描述】：

两者有什么不同：-

$("#btn").click(handler);

和

$("#btn").on('click', handler);

以上两种方法都会在click 事件上将处理程序绑定到元素。什么时候用哪个？

【问题讨论】：

第二个在通过 jquery 本身添加/创建元素时使用。顺便说一句，这对双方都有效
@Anant 所以你的意思是当添加的元素是动态添加的？
@Shubham 检查给定的链接你会得到正确的解释

标签： javascript jquery event-binding

【解决方案1】：

.click() 方法只是 .on( "click", handler ) 的简写。更多细节可以看这个链接https://api.jquery.com/click/

【讨论】：

【解决方案2】：

所以你可以从 jquery 源代码中看到.click 只是一个辅助函数。在内部，它将调用映射到this.on( name, null, data, fn )。所以它比其他任何东西都更方便，所有这些函数在内部都会调用.on。

额外。您也可以在没有参数的情况下触发此事件，这就是 else 在此 if 语句中所做的简写。这将在被调用的元素上触发 DOM 事件，例如使用 $button.click() 模拟单击，这又是 $button.trigger('click') 的简写。

jQuery.each( ( "blur focus focusin focusout resize scroll click dblclick " +
    "mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave " +
    "change select submit keydown keypress keyup contextmenu" ).split( " " ),
    function( i, name ) {

    // Handle event binding
    jQuery.fn[ name ] = function( data, fn ) {
        return arguments.length > 0 ?
            this.on( name, null, data, fn ) :
            this.trigger( name );
    };
});

【讨论】：