Javascript 如何在保持‘；这’；onclick函数中的引用？

以下内容不起作用。。。（至少不在Firefox中：

document.getElementById（'linkid'）。click（）

不是函数）

函数doOnClick（）{
document.getElementById（'linkid'）。单击（）；
//应发出警报（'/testlocation'）；
}

要触发事件，基本上只需调用事件处理程序即可 元素。代码的细微变化

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

if (typeof(evnt) == "function") {
    evnt.call(a);
}

---

如果您纯粹是为了引用onclick属性中的函数，那么这似乎是一个非常糟糕的主意。内联事件通常是一个坏主意

我建议如下：

function addEvent(elm, evType, fn, useCapture) {
    if (elm.addEventListener) {
        elm.addEventListener(evType, fn, useCapture);
        return true;
    }
    else if (elm.attachEvent) {
        var r = elm.attachEvent('on' + evType, fn);
        return r;
    }
    else {
        elm['on' + evType] = fn;
    }
}

handler = function(){
   showHref(el);
}

showHref = function(el) {
   alert(el.href);
}

var el = document.getElementById('linkid');

addEvent(el, 'click', handler);

如果您想从其他javascript代码中调用相同的函数，那么模拟单击调用该函数并不是最好的方法。考虑：

function doOnClick() {
   showHref(document.getElementById('linkid'));
}

您需要在该元素的上下文中创建事件处理程序：

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

---

否则，

这将引用执行上述代码的上下文。
解决这一问题的最佳方法是使用Vanilla JS，但如果您已经在使用jQuery，则有一个非常简单的解决方案：

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


函数doOnClick（）{
$（'#linkid'）。单击（）；
}

在IE8-10、Chrome、Firefox中测试。
一般来说，我建议不要“手动”调用事件处理程序


由于多次注册，执行的是什么尚不清楚
听众
进入递归和无限事件循环的危险（单击
触发点击B、触发点击A等）
对DOM的冗余更新
很难区分由用户引起的视图中的实际更改与作为初始化代码进行的更改（应仅运行一次）

更好的方法是弄清楚您到底想要发生什么，将其放入函数中并手动调用，然后将其注册为事件侦听器。
看看handleEvent方法

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


“原始”Javascript：

function MyObj() {
   this.abc = "ABC";
}
MyObj.prototype.handleEvent = function(e) {
   console.log("caught event: "+e.type);
   console.log(this.abc);
}

var myObj = new MyObj();

document.querySelector("#myElement").addEventListener('click', myObj);

现在单击您的元素（id为“myElement”），它应该在控制台中打印以下内容：

捕获事件：单击

ABC

这允许您将对象方法作为事件处理程序，并可以访问该方法中的所有对象属性

您不能只将对象的方法直接传递给addEventListener（比如：
element.addEventListener（'click'，myObj.myMethod）；
），并期望
myMethod
像通常对该对象调用一样工作。我猜想传递给addEventListener的任何函数都是以某种方式复制的，而不是被引用的。例如，如果将事件侦听器函数引用传递给addEventListener（以变量的形式），然后取消设置此引用，则捕获事件时仍会执行事件侦听器

另一个（不那么优雅的）解决方法是，将方法作为事件侦听器传递，并且仍然可以访问事件侦听器中的对象属性：

// see above for definition of MyObj

var myObj = new MyObj();

document.querySelector("#myElement").addEventListener('click', myObj.handleEvent.bind(myObj));

当然，OP也同样表示，这不管用，但对我来说确实管用。根据我源代码中的注释，它似乎是在OP的帖子发布前后实现的。也许现在更标准了

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

在我的例子中，我的按钮没有ID。如果您的元素有ID，最好使用以下（未测试）

我最初尝试过这种方法，但没有成功。在谷歌搜索之后，我回来发现我的元素是按名称命名的，并且没有ID。请仔细检查是否调用了正确的属性

来源：
旧线程，但问题仍然相关，所以

（1） 您问题中的示例现在在Firefox中也可以使用。但是，除了调用事件处理程序（显示警报）外，它还单击链接，从而导致导航（警报解除后）

（2） 仅调用事件处理程序（不触发导航）只需替换：

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

与

+1.此外，通过谷歌搜索发现foo.click（）只是IE，当然我可能错了…你应该使用点符号（.onclick），而不是括号符号（[“onclick”]）…onclick（）或.click（）都不能按预期工作。在Firefox.click（或括号中的[click']）中，它“不是一个函数”。但是当调用.onclick（）时，会丢失“this”引用（我在ASP.NET MVC中需要它，因为在执行函数中需要来自标记的信息），这是关于保留对“this”的引用。我不能在锚（.NET MVC）中单独生成onclick部分。我需要生成一个完整的锚标签。onclick函数完全需要这个标记（例如，它使用href属性）。我想你是唯一一个不认为我是傻瓜的人（因为没有提到括号符号/onclick | click浏览器不兼容）。完全正确考虑这一点：调用OnCutle函数调用所有事件处理程序注册吗？此外，错误调用事件不会产生与该事件相关联的默认操作（例如表单提交）。Gumbo，由于此代码确实会产生不同的结果，它仍然不能与Microsoft.Ajax和Microsoft.AjaxMvc库一起使用……为什么在此处使用
apply（）
？您只需执行
elem.onclick（），和
elem
将是函数中的“this”引用-简单！欢迎来到SO。你能详细说明一下为什么这是可行的（它到底是做什么的，等等）以及它与其他解决方案的区别吗？为什么要记下这个答案？如果您使用jquery，这是本页上的最佳解决方案。。。一个班轮-无法击败！答案不应该要求JQUERY为什么投反对票？请说明原因，如果您认为有问题，我可以改进我的问题。stackoverflow上指出，您不应该提供依赖于外部资源（如jQuery之类的库）的答案。如果OP没有在问题上明确提及，我认为是这一点促使了2013年的downvoteback，每个人都在使用jquery，但现在，我
document.getElementById('MyElementsId').click();

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

document.getElementById('linkid').onclick();