如何以编程方式从锚标记调用 onclick() 事件,同时在 onclick 函数中保留“this”引用?

IT技术 javascript dom-events
2021-01-24 14:47:19

以下不起作用...(至少在 Firefoxdocument.getElementById('linkid').click()中不是不是函数)

<script type="text/javascript">
    function doOnClick() {
        document.getElementById('linkid').click();
        //Should alert('/testlocation');
    }
</script>
<a id="linkid" href="/testlocation" onclick="alert(this.href);">Testlink</a>
6个回答

您需要apply在该元素的上下文中使用事件处理程序:

var elem = document.getElementById("linkid");
if (typeof elem.onclick == "function") {
    elem.onclick.apply(elem);
}

否则this将引用执行上述代码的上下文。

考虑一下:howtocreate.co.uk/tutorials/javascript/domevents——调用 onclick 函数会调用所有注册的事件处理程序吗?此外,错误地调用事件不会产生与该事件关联的默认操作(例如表单提交)。
2021-03-18 14:47:19
Gumbo,由于此代码确实会产生不同的结果,因此它仍然无法与 Microsoft.Ajax 和 Microsoft.AjaxMvc 库一起使用....
2021-03-24 14:47:19
我认为你是唯一一个不把我看成傻瓜的人(因为没有提到括号符号/onclick|click 浏览器不兼容)。发现!
2021-04-01 14:47:19
为什么用apply()在这里?您可以直接执行elem.onclick();,elem并将成为函数中的“this”引用 - 很简单!
2021-04-07 14:47:19

解决此问题的最佳方法是使用 Vanilla JS,但如果您已经在使用 jQuery,则有一个非常简单的解决方案:

<script type="text/javascript">
    function doOnClick() {
        $('#linkid').click();
    }
</script>
<a id="linkid" href="/testlocation" onclick="alert(this.href);">Testlink</a>

在 IE8-10、Chrome、Firefox 中测试。

早在 2013 年,每个人都在使用 jquery - 但现在,我会同意:) - 不过我会保留答案以供将来参考。
2021-03-16 14:47:19
为什么投反对票?请评论一个原因,如果您认为有问题,我可以改进我的问题。
2021-04-07 14:47:19
stackoverflow 上指出,如果 OP 没有在问题中明确提及它,则不应提供依赖于外部资源(例如 jQuery 之类的库)的答案,我认为这是导致否决票的原因
2021-04-10 14:47:19

要触发事件,您基本上只需调用该元素的事件处理程序。您的代码略有变化。

var a = document.getElementById("element");
var evnt = a["onclick"];

if (typeof(evnt) == "function") {
    evnt.call(a);
}
您应该使用点表示法 ( .onclick ) 而不是括号表示法 ( ["onclick"] )。
2021-03-20 14:47:19
.onclick() 或 .click() 都不能按预期工作。在Firefox .click(或带括号的['click'])中,它是“非功能”。但是当调用 .onclick() 时,你会丢失“this”引用(我在 ASP.NET MVC 中需要这个,因为在执行函数中需要来自 <a> 标签的信息)
2021-04-09 14:47:19
+1。此外,谷歌搜索显示 foo.click() 仅适用于 IE,当然我可能是错的......
2021-04-11 14:47:19

当然,OP 非常相似地表示这不起作用,但它对我有用。根据我的消息来源中的注释,它似乎是在 OP 的帖子前后或之后实施的。也许现在更标准了。

document.getElementsByName('MyElementsName')[0].click();

就我而言,我的按钮没有 ID。如果您的元素有一个 id,最好使用以下(未经测试)。

document.getElementById('MyElementsId').click();

我最初尝试过这种方法,但没有奏效。谷歌搜索后,我回来并意识到我的元素是按名称命名的,并且没有 ID。仔细检查您正在调用正确的属性。

来源:https : //developer.mozilla.org/en-US/docs/Web/API/HTMLElement/click

$("#linkid").trigger("click");
答案不应该需要 jQuery
2021-03-14 14:47:19
为什么要记下这个答案?如果您使用 jquery,这是此页面上的最佳解决方案......一个班轮 - 无法击败它!
2021-03-21 14:47:19
欢迎来到 SO。您能否详细说明为什么这样做(它究竟做了什么等)以及它与其他解决方案的区别?
2021-04-03 14:47:19