我正在使用此代码在某个元素上显示警报:
$("#resultsBox").click(function (event) { console.log('a'); });@H_404_4@我想只在你点击’#resultsBox’里面的’li’元素时才显示警告. @H_404_4@我试着这样做:
$("#resultsBox li").click(function (event) { console.log('a'); });@H_404_4@这是元素的#resultsBox结构:
<div id="resultsBox"> <ul> <li></li> <li></li> </ul> </div>@H_404_4@如何才能做到这一点?
解决方法
当您使用.click()绑定事件处理程序时,它将应用于此时与您的选择器匹配的任何元素,而不是以后动态添加的元素.
@H_404_4@鉴于你的div被称为“resultsBox”,假设你实际上是动态添加东西以显示其他操作的结果似乎是合理的,在这种情况下你需要使用委托的事件处理程序:
$("#resultsBox").on("click","li",function (event) { console.log('a'); });@H_404_4@这个
.on()
method的语法将处理程序绑定到“#resultsBox”,但是当点击发生时,jQuery检查它是否在第二个参数中与“li”选择器匹配的子元素上 – 如果是这样,它会调用你的函数,否则不会.