如何在 HTML 中调用 JavaScript 函数而不是 href
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5003867/
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
How to call JavaScript function instead of href in HTML
提问by Dutchie432
I have some mockup in HTML
我有一些 HTML 模型
<a href="javascript:ShowOld(2367,146986,2)"><img title="next page" alt="next page" src="/themes/me/img/arrn.png"></a>
I got the response from server when I sent the request.
当我发送请求时，我得到了服务器的响应。
With this mockup I got as a response of AJAX request that sends my code to server.
有了这个模型，我得到了 AJAX 请求的响应，该请求将我的代码发送到服务器。
Well, everything is fine but when I click on the link the browser wants to open the function as link; meaning after click I see the address bar as
好吧，一切都很好，但是当我点击链接时，浏览器想要打开该功能作为链接；意思是点击后我看到地址栏为
javascript:ShowOld(2367,146986,2)
means browser thing that's url if I want to do this in firebug that's work. Now I want to do that then when anyone clicks the link then the browser tries to call the function already loaded in the DOM instead of trying to open them in browser.
如果我想在工作的萤火虫中执行此操作，则表示浏览器的内容是 url。现在我想这样做，然后当有人单击链接时，浏览器会尝试调用已加载到 DOM 中的函数，而不是尝试在浏览器中打开它们。
回答by Dutchie432
That syntax should work OK, but you can try this alternative.
该语法应该可以正常工作，但您可以尝试这种替代方法。
<a href="javascript:void(0);" onclick="ShowOld(2367,146986,2);">
or
或者
<a href="javascript:ShowOld(2367, 146986, 2);">
UPDATED ANSWER FOR STRING VALUES
字符串值的更新答案
If you are passing strings, use single quotes for your function's parameters
如果要传递字符串，请对函数的参数使用单引号
<a href="javascript:ShowOld('foo', 146986, 'bar');">
回答by Felix Kling
If you only have as "click event handler", use a <button>instead. A link has a specific semantic meaning.
如果您只有“单击事件处理程序”，请改用 a <button>。链接具有特定的语义含义。
E.g.:
例如：
<button onclick="ShowOld(2367,146986,2)">
<img title="next page" alt="next page" src="/themes/me/img/arrn.png">
</button>
回答by soju
Try to make your javascript unobtrusive :
尽量让你的 javascript 不显眼：
- you should use a real link in href attribute
- and add a listener on click event to handle ajax
- 您应该在 href 属性中使用真实链接
- 并在点击事件上添加一个监听器来处理ajax
回答by tolsen64
I use a little CSS on a span to make it look like a link like so:
我在 span 上使用了一点 CSS 使其看起来像这样的链接：
CSS:
CSS：
.link {
color:blue;
text-decoration:underline;
cursor:pointer;
}
HTML:
HTML：
<span class="link" onclick="javascript:showWindow('url');">Click Me</span>
JAVASCRIPT:
爪哇脚本：
function showWindow(url) {
window.open(url, "_blank", "directories=no,titlebar=no,toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,resizable=yes");
}
回答by hellsgate
Your should also separate the javascript from the HTML.
HTML:
您还应该将 javascript 与 HTML 分开。
HTML：
<a href="#" id="function-click"><img title="next page" alt="next page" src="/themes/me/img/arrn.png"></a>
javascript:
javascript:
myLink = document.getElementById('function-click');
myLink.onclick = ShowOld(2367,146986,2);
Just make sure the last line in the ShowOld function is:
只需确保 ShowOld 函数中的最后一行是：
return false;
as this will stop the link from opening in the browser.
因为这将阻止链接在浏览器中打开。
回答by nico
<a href="#" onclick="javascript:ShowOld(2367,146986,2)">
<a href="#" onclick="javascript:ShowOld(2367,146986,2)">
回答by Colin 't Hart
hrefis optional for aelements.
href对于a元素是可选的。
It's completely sufficient to use
使用就完全够了
<a onclick="ShowOld(2367,146986,2)">link text</a>
