javascript - dispatchEvent 'mouseover' 不工作

Question

我有以下代码 http://jsfiddle.net/yc7sj3pt/2/

document.getElementById('obj_one').addEventListener('mouseover', function(){
    var e = document.createEvent('HTMLEvents');
    e.initEvent('mouseover', true, false);

    document.getElementById('obj_two').dispatchEvent(e);
    console.log('hover');
}, false);

当我在 #obj_one 上 mouseover 时，我试图让 #obj_two 对悬停使用react(因此变为红色)，但它不工作。我做错了什么？

Answer 1

根据 this answer ，你不能:

Events that are generated by the user agent, either as a result of user interaction, or as a direct result of changes to the DOM, are trusted by the user agent with privileges that are not afforded to events generated by script through the DocumentEvent.createEvent("Event") method, modified using the Event.initEvent() method, or dispatched via the EventTarget.dispatchEvent() method. The isTrusted attribute of trusted events has a value of true, while untrusted events have a isTrusted attribute value of false.

Most untrusted events should not trigger default actions, with the exception of click or DOMActivate events.

推荐的方法是在 mouseover 和 mouseout 事件上添加和删除一个类，我已经在这个 jsfiddle 中完成了。 .