是否可以将鼠标单击调用事件()到<input type = text>元素？

Question

基本上我正在尝试使用以下代码将自定义鼠标单击事件发送到文本输入元素(请参阅此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"元素上调用它时根本不起作用.

现在这里是initMouseEvent()关于MDN 的定义:

event.initMouseEvent(type, canBubble, cancelable, view, 
                 detail, screenX, screenY, clientX, clientY, 
                 ctrlKey, altKey, shiftKey, metaKey, 
                 button, relatedTarget);

所以在上面的例子中screenX, screenY, clientX并且clientY都是0(仍然,上面的代码与复选框一起完全正常,无论它们的位置如何).我尝试捕获一个真实的事件并将屏幕和客户端坐标传递给cusom事件,但无济于事.

我可能由于安全原因,文本输入元素可能会忽略自定义鼠标事件,但是element.focus()它也不应该工作.

任何想法或见解将不胜感激!

Answer 1

至于我可以告诉你的代码工作正常.但是它并没有像你想象的那样聚焦输入字段,但事件在输入字段上被触发就好了,如这个小提琴所示:http://jsfiddle.net/ENvZY/

注意:代码不兼容crossbrowser,但在ie8中失败.

考虑使用像jQuery这样的好的crossbrowser库而不是原生的DOM方式 - 轮子存在并且工作完美,重新发明它是浪费时间:)