如何使用 javascript/jquery 使 <a> 标记元素触发多个功能答案

【问题标题】：How to make an <a> tag element to trigger multiple functions with javascript/jquery如何使用 javascript/jquery 使 <a> 标记元素触发多个功能
【发布时间】：2012-02-24 19:29:13
【问题描述】：

我的网页中有一个链接，该链接本身触发了一个我无法修改的功能，但我想让该链接在点击时也同时调用另一个JavaScript函数，或者最好在第一个函数之后调用完毕。所以一键调用两个功能……能实现吗？谢谢

<a title="Next Page" href="javascript:__doPostBack('Booklet1','V4504')">Next</a>

是我要修改的示例标签，如何使其同时或最好在_doPostBack 完成后调用“myFunc”。

附： V4504 等_doPostBack 的函数参数是由ASP 用户控件动态生成的。所以我不能简单地将它视为一个静态函数并将它与另一个绑定。我想我只能给它附加一些功能？除非我先解析整个页面，提取函数名和它当前的参数……因为每次点击链接，V4504等参数都会改变它的值……

谢谢！

【问题讨论】：

是的。您只需要使用 js 将额外的 onClick 事件绑定到链接即可。
你能发布A标签的html吗？
只使用javascript还是jquery？
您好 jrieiro，除非太复杂，否则最好只使用 javascript
嗨 Mike C，我已经添加了代码，谢谢。

标签： javascript function triggers call href

【解决方案1】：

您应该能够使用.onclick 或.addEventListener('click', function) 将多个事件处理程序附加到单个锚标记

https://developer.mozilla.org/en/DOM/element.addEventListener

【讨论】：

【解决方案2】：

您可以通过以下方式使用纯 Javascript 将处理程序附加到元素单击事件：

function hello()
{
    alert("Hello!")
}
var element = document.getElementById("YourAElementID");
if (element.addEventListener)
{
    element.addEventListener("click", hello, false);
}
else
{
    element.attachEvent("onclick", hello);
}

它支持所有常见的浏览器。

【讨论】：

顺便说一句，你可以用新的函数替换你的__doPostBack函数（比如link），它调用“__doPostBack”而不是调用你的函数......但这是一种非常不安全的方式，天知道这个 __doPostBack 是否还需要其他地方

【解决方案3】：

是的，您可以通过多种方式执行此操作（我同时使用 $(this) 和 $('identifier')，因为您没有说明函数是如何绑定的）：

$(this).click(function(){
   my_function_1();
   my_function2()
});

或者

$('my element').click(function(){
   my_function_1();
});
$('my element').click(function(){
   my_function_2();
});

或者，如果函数驻留在另一个对象上：

$(this).click(function(){
   my_function_1();
   $('#other_element_id').trigger('click'); //there are a bunch of syntaxes for this
});

Sans JQuery，你可以使用：

var myObj  = document.getElementById('element name');
myObj.addEventListener('click', function(){
   alert('first!');
});
myObj.addEventListener('click', function(){
   alert('second!');
});

单击将导致两个连续的警报提示

【讨论】：

嗨，本，感谢您的快速回复。很抱歉我没有正确解释情况：V4504 等_doPostBack 的函数参数是由ASP 用户控件动态生成的。所以我不能简单地将它视为一个静态函数并将其与另一个函数绑定。我想我只能给它附加一些功能？除非我先解析整个页面，然后提取函数名和它当前的参数……因为每次点击链接，V4504等参数都会改变它的值……
好的，澄清后，使用addEventListener 方法...这将保留现有的绑定函数，但附加另一个操作。
谢谢 Ben，addEventListener 听起来不错，我会先试用并回复您。
我最终使用了 onclick，但我相信 addEventListener 也可以。感谢您的帮助。