我们可以使用jQuery`on`作为静态创建的DOM元素,以及on(事件,选择器,函数),on(事件

我们可以使用jQuery来创建静态创建的DOM元素而不是jQuery
点击(我知道这会有用,但我想知道它是否适合使用？)

这有什么不同

$(‘body’).on(‘click’,’#joinSession’,function(){})和$(‘#joinSession’).on(‘click’,function(){})

我创建的jsfiddle两种方法都给出了相同的结果,这有什么显着的不同？

HTML

<div class="container">
    <div class="controls">
        <input type="button" value="Create session" id="createSession"/>
        <input type="button" value="Join session" id="joinSession"/>
    </div>
    <div class="othersVideos"></div>
    <div class="ownVideo"></div>
</div>

Jquery脚本

$('#createSession').on('click', function() {
    alert('test');
});

$('body').on('click', '#joinSession', function() {
    alert('testing')
});

$('#createSession').on('click', function() {
    alert('test');
});

这会将单击处理程序直接绑定到与选择器匹配的任何元素.如果在绑定调用时没有找到任何元素,它将不执行任何操作.

$('body').on('click', '#joinSession', function() {
    alert('testing')
});

这使用事件委托并将单击处理程序绑定到正文.每当事件冒泡到正文时,jQuery将检查事件的起源.如果它源自与第二个参数选择器匹配的东西,它将触发处理程序.这使得事件可以绑定到可能尚不存在的元素 – 只要它们在事件触发时存在,处理程序仍将应用于它们.

应该几乎总是使用第二种语法,因为它具有性能和内存优势.为了获得最佳效果,您应该使用选择器作为快速(id)并尽可能靠近元素而不是正文.有关事件委派的更多信息,请查看jqFundamentals.