将jQuery事件处理程序应用于相同类型的所有元素

Question

我希望这是一个简单的问题。我更习惯于jQuery和JavaScript。

我正在尝试编写一个简单的jQuery事件处理程序，当我将鼠标悬停在页面上时，它将突出显示我页面上的li。我试过了：

$( 'li' ).on('mouseover', function(evt) {
   $( evt.target ).effect( 'highlight', {}, 1000 ); 
});

它不起作用。它不会产生错误，但没有结果。

但是，如果我尝试这样的话：

$( document ).on('mouseover', function(evt) {
   $( evt.target ).effect( 'highlight', {}, 1000 ); 
});

我能够通过鼠标悬停它来突出显示我想要的任何DOM元素。

我将事件处理程序放在我的js文件的末尾，并且显示第二种方法，即使动态生成的DOM元素也可以突出显示而没有问题。但是，如果我尝试按标签或类别选择DOM元素，我将无法产生任何效果。

Answer 1

尝试委托最新文档，因为您定位的是动态内容：

$( document ).on('mouseover', 'li', function(evt) {
  $( evt.target ).effect( 'highlight', {}, 1000 ); 
});

您可能需要阅读此Event Delegation。