基本上，我尝试使用以下代码将自定义的鼠标单击事件分派(dispatch)到文本输入元素(参见 jsFiddle):
function simulateClick(id) {
var clickEvent = document.createEvent("MouseEvents");
clickEvent.initMouseEvent("click", true, true, window, 1, 0, 0, 0, 0,
false, false, false, false, 0, null);
var element = document.getElementById(id);
element.dispatchEvent(clickEvent);
}
当我在 type="checkbox" 元素上运行该代码时，它工作得很好，但在 type="text" 上调用时它根本不起作用> 元素。
下面是 MDN 上 initMouseEvent() 的定义:
event.initMouseEvent(type, canBubble, cancelable, view,
detail, screenX, screenY, clientX, clientY,
ctrlKey, altKey, shiftKey, metaKey,
button, relatedTarget);
所以在上面的例子中 screenX, screenY, clientX 和 clientY 都将是 0(不过，上面的代码与复选框，无论其位置如何)。我 try catch 真实事件并将屏幕和客户端坐标传递给自定义事件，但无济于事。
我虽然出于安全原因，文本输入元素可能会忽略自定义鼠标事件，但是 element.focus() 也不应该工作，但确实如此。
任何想法或见解将不胜感激!
最佳答案
据我所知，您的代码运行良好。然而，它并没有像您想象的那样关注输入字段，但是事件在输入字段上被触发得很好，如这个 fiddle 所示:http://jsfiddle.net/ENvZY/
注意:虽然代码不兼容跨浏览器，但它在 ie8 中失败。
考虑使用像 jQuery 这样的优秀跨浏览器库，而不是采用原生 DOM 方式 - 轮子存在并且工作完美，重新发明它是浪费时间:)
关于javascript - 是否可以通过鼠标单击 <input type=text> 元素来 dispatchEvent()？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5352709/