通过在超链接中使用 onClick 调用 javascript 函数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13290672/
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
Calling a javascript function by using onClick in a hyperlink
提问by Goaler444
I have been looking online, but I have failed to find a direct answer to my question:
我一直在网上寻找，但我没有找到我的问题的直接答案：
Can you use onClick for a tags?
你能用 onClick 做标签吗？
In other words can you do this (note echoed through php)?
换句话说，你能做到这一点（注意通过 php 回显）？
echo "<a href=\"#\" id =\"loginbutton\" onClick=\"counter()\"></a>\n";
I tried to run this, but when I click on the link, my counter function is not being called.
我试图运行它，但是当我点击链接时，我的计数器功能没有被调用。
The rest of my code snippet:
我的其余代码片段：
echo "<script type=\"text/javascript\" src=\"src\jquery\jquery.js\">\n";
echo "function counter(){\n";
echo "alert(\"HELLO WORLD!\");\n";
echo "}\n";
echo "</script>\n";
echo "<a href=\"#\" id =\"loginbutton\" onClick=\"counter()\"></a>\n";
回答by Chase
Although that shouldwork, it's better practice not to bind events inline. I would suggest looking into addEventListenerand for older versions of IE, attachEvent. More information on these can be found in a topic here: Correct usage of addEventListener() / attachEvent()?
尽管这应该可行，但最好不要内联绑定事件。我建议寻找到addEventListener和旧版本的IE， attachEvent。可以在此处的主题中找到有关这些的更多信息：正确使用 addEventListener() / attachEvent()?
If you wait for the window to be ready, you ensure that the element is on the page and defined for you to access it.
如果您等待窗口准备好，您可以确保该元素在页面上并定义为您可以访问它。
window.onload = function(){
//add any event listeners using the above methods in here
}
示例：
<script>
window.onload = function(){
var t = document.getElementById("test");
t.addEventListener("click", sayHi, false);
function sayHi(){
alert("Hi");
}
}
</script>
<div id="test">test</div>?
According to your above echo statements, if you are determined to make it work that way then you can try this:
根据您上面的 echo 声明，如果您决心让它以这种方式工作，那么您可以尝试以下操作：
echo "<script type='text/javascript' src='src/jquery/jquery.js'></script>\n";
echo "<script>\n"
echo "function counter(){\n";
echo "alert('HELLO WORLD!');\n";
echo "}\n";
echo "</script>\n";
echo "<a href='#' id ='loginbutton' onClick='counter()'></a>\n";
notice that I closed the script tag including jQuery and added a new opening tag right below it.
请注意，我关闭了包含 jQuery 的脚本标签，并在其正下方添加了一个新的开始标签。
EDIT:
编辑：
Script tags that reference external resources (via the src attribute) are no longer able to execute script embedded within the tag itself.
引用外部资源（通过 src 属性）的脚本标签不再能够执行嵌入标签本身的脚本。
Read more here
在这里阅读更多
回答by Riaan Walters
Made a little Demo code, Note that the function fires and then the href is followed. You can turn this off with JS by returning false.
做了一点Demo代码，注意是函数触发，然后是href。您可以通过返回 false 使用 JS 关闭此功能。
<script type="text/javascript">
function counter() {
alert("do something here")
var FollowHref_Or_Not = false;
// true would simply follow the href after the function is activated
return FollowHref_Or_Not;
}
</script>
<a href="/" onclick="return counter()">Test Link</a>
回答by Eli Gassert
To add more context to the comments above, here's a working example. Where I put the HTML comment about simulating an echo, just put your PHP echo line. Also note that I added a return false; This prevents the default link click behavior from executing. Since your href is "#" it would modify your URL to put "#" in the URL so if you used your browser back button you'd still be "stuck" on the same page.
要为上述评论添加更多上下文，这里有一个工作示例。在我放置有关模拟回声的 HTML 注释的地方，只需放置您的 PHP 回声行。另请注意，我添加了 return false; 这可以防止执行默认的链接点击行为。由于您的 href 是“#”，它会修改您的 URL 以将“#”放在 URL 中，因此如果您使用浏览器的后退按钮，您仍然会“卡在”同一页面上。
<html>
<head>
<script type="text/javascript">
function connect()
{
alert('connected!');
}
</script>
</head>
<body>
<!-- simulated echo result here -->
<a href="#" onclick="connect(); return false;">Testing</a>
</body>
</html>
