在链接上模拟 jQuery/JavaScript 中的单击答案

【问题标题】：Simulating a click in jQuery/JavaScript on a link在链接上模拟 jQuery/JavaScript 中的单击
【发布时间】：2009-12-03 11:31:35
【问题描述】：

我想使用 JavaScript 模拟对页面上任何链接的点击。如果该链接具有绑定到其“onclick”事件的某些函数（由我无法控制的任何其他 JS），则必须调用该函数，否则该链接应以正常方式运行并打开一个新页面。

我不确定仅检查“onclick”处理程序的值是否足够。我想构建它以便它适用于任何链接元素。

我无法控制使用任何 JS 库（不一定是 jQuery）或仅使用 JavaScript 绑定到链接的 onclick 事件的函数。

编辑：借助下面的答案，看起来可以检查使用 jQuery 或使用 onclick 属性附加的事件处理程序。如何检查使用 addEventListener / 任何其他 JS 库附加的事件处理程序以使其万无一失？

【问题讨论】：

“如何检查使用 addEventListener / 任何其他 JS 库附加的事件处理程序，以使其万无一失”？现在 that 是重复的 ;) 见 stackoverflow.com/questions/446892/…
仍然没有解决方案，但是 :) 也许反过来尝试通过创建 MouseEvent 来实际模拟点击？ stackoverflow.com/questions/1421584/…
@Ankit：是的，第二个答案将触发处理程序，无论它们是如何连接的。您仍然说“否则链接应该以正常方式运行并打开一个新页面”。你会有问题的。抱歉，我没有时间在这里提供更多帮助。
@Crescent 我尝试了上述方法并且它有效（该方法仅适用于 Firefox）dispatchEvent() 方法根据 preventDefault() 是否被触发返回一个布尔值。我检查该值，如果链接的 href 属性设置为查看链接是否应该打开另一个页面，developer.mozilla.org/En/DOM/Element.dispatchEvent
@Crescent 顺便说一句，你很有帮助。它认为我将更多地使用 StackOverflow 而不是无休止的谷歌搜索 :)

标签： javascript jquery onclick

【解决方案1】：

你可以使用click函数来触发被选元素的点击事件。

例子：

$( 'selector for your link' ).click ();

您可以在 jQuery 的documentation 中了解各种选择器。

编辑：就像下面的评论者所说的那样；这仅适用于使用 jQuery、内联或“element.onclick”样式附加的事件。它不适用于 addEventListener，如果没有定义事件处理程序，它将不会跟随链接。你可以这样解决这个问题：

var linkEl = $( 'link selector' );
if ( linkEl.attr ( 'onclick' ) === undefined ) {
    document.location = linkEl.attr ( 'href' );
} else {
    linkEl.click ();
}

虽然不知道 addEventListener。

【讨论】：

查看罗伯特对上述答案的评论
这不是真的。无论它是如何绑定的，它都适用于所有事件。
click方法触发链接的onclick方法。它不遵循 href 属性中定义的 url。
@Jan：这也不是真的。它适用于内联 onclick 处理程序，但除此之外仅适用于与 jQuery 本身绑定的事件。如果有其他与addEventListener 绑定的事件，例如 jQuery 会错过这些。
@Crescent：你是对的，对此感到抱歉。但是，如果您执行以下操作，它就会起作用： element.onclick = ...

【解决方案2】：

为什么不只是好的 ol' javascript？

$('#element')[0].click()

【讨论】：

通过访问 jQuery 集合中的第一个元素，您将获得一个 DOM 元素，接下来您将从 HTMLElement 接口调用一个方法，这实际上是好的 ol' javascript
啊！我的错。我没注意[0]。但为什么要这样做？ jQuery 也支持.click() 方法，所以只需$('#element').click() 就足够了。另一方面，如果你真的想用普通的 javascript 来做，document.getElementById('element').click() 会做，对吧？
SNag，我记得必须这样做一次，因为在 IE 中，jQuery .click 或 .trigger 函数实际上并没有触发事件......所以，你会比强大的 jquery 更有优势选择器，然后只获取 DOM 元素以对其执行任何 javascript。
非常感谢我的朋友，好的 ol' javascript 在全新的 javascript 失败的情况下工作：D（如果您想知道在哪种情况下：尝试使用 JavaScript 触发点击 Facebook 的“Poke”按钮） .
[0] 确实与众不同！ :)

【解决方案3】：

只是

$("#your_item").trigger("click");

使用 .trigger() 可以模拟多种类型的事件，只需将其作为参数传递即可。

【讨论】：

【解决方案4】：

简单！只需使用 jQuery 的 click 函数即可：

$("#theElement").click();

【讨论】：

根据我的阅读，jQuery 的 click() 函数不只触发那些使用 jQuery 绑定到元素点击事件的函数吗？反正也没用。
@Ankit：它还会触发任何内联事件处理程序（即`onclick="..."），但是是的，否则你是正确的。
@Crescent 谢谢，我不知道
啊抱歉，这个问题比我想象的要难！

【解决方案5】：

试试这个

function submitRequest(buttonId) {
    if (document.getElementById(buttonId) == null
            || document.getElementById(buttonId) == undefined) {
        return;
    }
    if (document.getElementById(buttonId).dispatchEvent) {
        var e = document.createEvent("MouseEvents");
        e.initEvent("click", true, true);
        document.getElementById(buttonId).dispatchEvent(e);
    } else {
        document.getElementById(buttonId).click();
    }
}

你可以像这样使用它

submitRequest("target-element-id");

【讨论】：

这很好用。感谢您发布非 jquery 版本。
出于某种原因，jquery click() 不起作用，但 dispatchEvent 起作用。知道为什么吗？我通过 chrome 扩展点击了 ExtJS 网站

【解决方案6】：

首先查看question，看看如何找到一个链接是否分配了一个 jQuery 处理程序。

下次使用：

$("a").attr("onclick")

查看是否有分配给它的 javascript 事件。

如果以上任何一个为真，则调用 click 方法。如果没有，请获取链接：

$("a").attr("href")

并跟随它。

如果使用addEventListener添加事件处理程序，恐怕我不知道该怎么办。如果您负责整个页面的源代码，请仅使用 jQuery 事件处理程序。

【讨论】：

是的，但是与“我无法控制的其他 JS”（正如 OP 提到的）绑定的事件，例如 addEventListener 或 attachEvent jQuery 无法知道这些： stackoverflow.com/questions/446892/…
如果我负责页面源，那就容易多了。不幸的是，我将它构建为一个插件，因此它需要完全万无一失。

【解决方案7】：

当您使用 Rails 远程表单按钮模拟点击时，所有这些可能无济于事。我试图从这里的原型移植漂亮的事件模拟：my snippets。刚刚做了，它对我有用。

【讨论】：