谁能给我解释一下为什么实际点击鼠标 并且 $('div').click() 运行点击事件 3 次，而 $('div')[0].dispatchEvent(new MouseEvent('click')) 根据浏览器控制台仅运行 1 次点击事件？
这是一个简单的 html 代码:
<div>test</div>
这是一段javascript代码:
$('*').click(function(e){
console.log(e);
});
var c = new MouseEvent('click');
// Actual mouse click output event 3 times
//$('div').click(); // output event 3 times
$('div')[0].dispatchEvent(c); // output event 1 time
http://jsfiddle.net/5uvjwa4t/2/
谢谢
最佳答案
星号匹配 <html>和 <body标签以及点击事件冒泡，当您使用星号作为事件处理程序的选择器时，它会在三个元素上触发。
$('*') // matches all elements, including html and body
$('div') // matches the DIV only
当您点击像这样嵌套的 div 时
<html>
<body>
<div>
点击向上移动(气泡)并触发所有父元素。
使用 dispatchEvent在 Chrome 中为我触发事件三次，但在其他浏览器中可能会有所不同。
让它始终如一地冒泡 bubbles可以设置设置，这样它就会像普通的点击和冒泡一样运行。
var c = new MouseEvent('click', {bubbles:true});
关于javascript - 鼠标点击 vs jquery click vs dispatchEvent click，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32010675/