it-swarm.dev

如何以编程方式单击JavaScript中的元素?

在IE中,我可以从JavaScript调用element.click() - 如何在Firefox中完成相同的任务?理想情况下,我希望有一些JavaScript可以跨浏览器同样运行,但如果有必要,我将为此提供不同的每浏览器JavaScript。

55
Bruce

document.createEvent文档 表示“createEvent方法已被弃用。使用 事件构造函数 而不是.-

所以你应该使用这种方法:

var clickEvent = new MouseEvent("click", {
    "view": window,
    "bubbles": true,
    "cancelable": false
});

并在这样的元素上触发它:

element.dispatchEvent(clickEvent);

如图所示 这里

63
Iulian Onofrei

对于firefox链接似乎是“特殊”。我能够使这个工作的唯一方法是使用createEvent 在MDN上描述 并调用initMouseEvent函数。即使这不完全,我不得不手动告诉浏览器打开链接...

var theEvent = document.createEvent("MouseEvent");
theEvent.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
var element = document.getElementById('link');
element.dispatchEvent(theEvent);

while (element)
{
    if (element.tagName == "A" && element.href != "")
    {
        if (element.target == "_blank") { window.open(element.href, element.target); }
        else { document.location = element.href; }
        element = null;
    }
    else
    {
        element = element.parentElement;
    }
}
30
will

使用 jQuery 你可以做同样的事情,例如:

$("a").click();

这将“点击”页面上的所有锚点。

21
Jake McGraw

element.click()是 W3C DOM规范 概述的标准方法。 Mozilla的Gecko/Firefox 遵循标准 只允许在INPUT元素上调用此方法。

10
Bjorn Tipling

您是否尝试实际关注链接或触发onclick?您可以使用以下内容触发onclick:

var link = document.getElementById(linkId);
link.onclick.call(link);
8
jiggy

这是一个跨浏览器工作函数(也可用于点击处理程序以外):

function eventFire(el, etype){
    if (el.fireEvent) {
      el.fireEvent('on' + etype);
    } else {
      var evObj = document.createEvent('Events');
      evObj.initEvent(etype, true, false);
      el.dispatchEvent(evObj);
    }
}
7
KooiInc

我使用了上面列出的KooiInc函数,但我不得不使用两个不同的输入类型,一个'按钮'用于IE,一个'submit'用于FireFox。我不确定为什么,但它的工作原理。

// HTML

<input type="button" id="btnEmailHidden" style="display:none" />
<input type="submit" id="btnEmailHidden2" style="display:none" />

//在JavaScript中

var hiddenBtn = document.getElementById("btnEmailHidden");

if (hiddenBtn.fireEvent) {
    hiddenBtn.fireEvent('onclick');
    hiddenBtn[eType]();
}
else {
    // dispatch for firefox + others
    var evObj = document.createEvent('MouseEvent');
    evObj.initEvent(eType, true, true);
    var hiddenBtn2 = document.getElementById("btnEmailHidden2");
    hiddenBtn2.dispatchEvent(evObj);
}

我已经搜索并尝试了许多建议,但这最终起作用了。如果我有更多的时间,我会想调查为什么提交使用FF和按钮IE但这对于下一个问题现在是一个奢侈品。

1
krm