如何在 HTML 中調用 javascript 函數而不是 href

問題描述

我有一些 html 的模型

<a href=""><img title="next page" alt="next page" src="/themes/me/img/arrn.png"></a>

當我發送請求時，我收到了服務器的響應。

有了這個模型，我得到了一個 ajax 請求的響應，將我的代碼發送到服務器。

那麼一切都很好，但當我點擊鏈接瀏覽器想要打開這個功能作為鏈接; 意思是點擊後我看到地址欄

javascript:ShowOld(2367,146986,2)

這意味着瀏覽器的東西是 url，如果我想在 firebug 這樣做的工作。現在我想這樣做，然後當有人點擊鏈接，然後瀏覽器嘗試調用已經加載在 DOM 中的功能，而不是試圖在瀏覽器中打開它們。

最佳解決方案

該語法應該可以正常工作，但您可以嘗試這種替代方法。

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

要麼

<a href="">

次佳解決方案

如果您只具有「點擊事件處理程序」，請改用<button> 。鏈接具有特定的語義含義。

例如。：

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

第三種解決方案

嘗試使您的 JavaScript 不引人注意：

你應該在 href 屬性中使用一個真正的鏈接
並在 click 事件上添加一個監聽器來處理 ajax

第四種方案

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

第五種方案

您還應該將 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);

只要確保 ShowOld 函數的最後一行是：

return false;

因為這將阻止鏈接在瀏覽器中打開。

第六種方案

我在一個跨度上使用一點 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");
}

參考文獻

How to call javascript function instead of href in HTML

注：本文內容整合自 Google/Baidu/Bing 輔助翻譯的英文資料結果。如果您對結果不滿意，可以加入我們改善翻譯效果：薇曉朵技術論壇。

如何在 HTML 中調用 javascript 函數而不是 href