关于元素的孩子的jQuery警告onclick？

我正在使用此代码在某个元素上显示警报：

$("#resultsBox").click(function (event) {
    console.log('a');
    });

我想只在你点击’#resultsBox’里面的’li’元素时才显示警告.

我试着这样做：

$("#resultsBox li").click(function (event) {
    console.log('a');
    });

这是元素的#resultsBox结构：

<div id="resultsBox">
  <ul>
    <li></li>
    <li></li>
  </ul>
</div>

如何才能做到这一点？

解决方法

当您使用.click()绑定事件处理程序时,它将应用于此时与您的选择器匹配的任何元素,而不是以后动态添加的元素.

鉴于你的div被称为“resultsBox”,假设你实际上是动态添加东西以显示其他操作的结果似乎是合理的,在这种情况下你需要使用委托的事件处理程序：

$("#resultsBox").on("click","li",function (event) {
    console.log('a');
});

这个.on() method的语法将处理程序绑定到“#resultsBox”,但是当点击发生时,jQuery检查它是否在第二个参数中与“li”选择器匹配的子元素上 – 如果是这样,它会调用你的函数,否则不会.

原文地址：https://www.jb51.cc/jquery/177987.html