Javascript HTML 标签 <a> 想要同时添加 href 和 onclick 工作
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14867558/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
HTML tag <a> want to add both href and onclick working
提问by Ian
I'd like to ask about HTML tag
我想问一下 HTML 标签
<a href="www.mysite.com" onClick="javascript.function();">Item</a>
How to make this atag working with hrefand onClick? (prefer onClick running first then href)
如何使其成为使用href和onClick的标签？（更喜欢先onClick运行然后href）
回答by Ian
You already have what you need, with a minor syntax change:
您已经有了所需的东西，只需稍加修改语法即可：
<a href="www.mysite.com" onclick="return theFunction();">Item</a>
<script type="text/javascript">
function theFunction () {
// return true or false, depending on whether you want to allow the `href` property to follow through or not
}
</script>
The default behavior of the <a>tag's onclickand hrefproperties is to execute the onclick, then follow the hrefas long as the onclickdoesn't return false, canceling the event (or the event hasn't been prevented)
<a>标签onclick和href属性的默认行为是执行onclick，然后href只要onclick不返回false，就取消该事件（或该事件未被阻止）
回答by Sudipta Chatterjee
Use jQuery. You need to capture the clickevent and then go on to the website.
使用jQuery。您需要捕获click事件，然后访问网站。
$("#myHref").on('click', function() {
alert("inside onclick");
window.location = "http://www.google.com";
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#" id="myHref">Click me</a>回答by Kamil Kie?czewski
To achieve this use following html:
要实现此目的，请使用以下 html：
<a href="www.mysite.com" onclick="make(event)">Item</a>
<script>
function make(e) {
// ... your function code
// e.preventDefault(); // use this to NOT go to href site
}
</script>
Here is working example.
这是工作示例。
回答by Dominic Phillips
No jQuery needed.
不需要jQuery。
Some people say using onclickis bad practice...
This example uses pure browser javascript. By default, it appears that the click handler will evaluate before the navigation, so you can cancel the navigation and do your own if you wish.
此示例使用纯浏览器 javascript。默认情况下，单击处理程序似乎会在导航之前进行评估，因此您可以取消导航并根据需要执行自己的操作。
<a id="myButton" href="http://google.com">Click me!</a>
<script>
window.addEventListener("load", () => {
document.querySelector("#myButton").addEventListener("click", e => {
alert("Clicked!");
// Can also cancel the event and manually navigate
// e.preventDefault();
// window.location = e.target.href;
});
});
</script>
回答by mak-273
Use ng-clickin place of onclick. and its as simple as that:
使用ng-click到位onclick。就这么简单：
<a href="www.mysite.com" ng-click="return theFunction();">Item</a>
<script type="text/javascript">
function theFunction () {
// return true or false, depending on whether you want to allow
// the`href` property to follow through or not
}
</script>
