如何在HTML中调用JavaScript函数而不是href

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.

意思是浏览器，如果我想在firebug中做这个工作。现在我想这样做当有人点击链接时浏览器会尝试调用已经加载到DOM中的函数而不是试图在浏览器中打开它们。

6 个解决方案

#1

133

That syntax should work OK, but you can try this alternative.

该语法应该可以工作，但是您可以尝试这种替代方法。

<a href="javascript:void(0);" onclick="ShowOld(2367,146986,2);">

或

<a href="javascript:ShowOld(2367,146986,2);">

#2

If you only have as "click event handler", use a <button> instead. A link has a specific semantic meaning.

如果您只有“单击事件处理程序”，则使用

E.g.:

例如:

<button onclick="ShowOld(2367,146986,2)">
    <img title="next page" alt="next page" src="/themes/me/img/arrn.png">
</button>

#3

Try to make your javascript unobtrusive :

尽量使你的javascript不突兀:

you should use a real link in href attribute
您应该在href属性中使用一个真正的链接
and add a listener on click event to handle ajax
并在click事件上添加一个侦听器来处理ajax

#4

href="#" onclick="javascript:ShowOld(2367,146986,2)

#5

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:

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.

这将阻止链接在浏览器中打开。

#6

I use a little CSS on a span to make it look like a link like so:

我在跨度上使用了一些CSS使它看起来像这样的链接:

CSS:

.link {
    color:blue;
    text-decoration:underline;
    cursor:pointer;
}

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");
}

#1

133