如何禁用JavaScript中的href鏈接？

Question

我有一個標籤<a href="#"> Previous </a> 1 2 3 4 <a href="#"> Next </a>，在某些情況下，我希望此標籤被完全禁用。從評論

代碼（這是如何生成的鏈接）

if (n_index != n_pages) 
    a = a+'<li><a href="#" onclick="javascript:paginateAjaxPage('+(n_index+1) +','+stype+');">></a></li><li><a href="#" onclick="javascript:paginateAjaxPage('+n_pages+','+stype+');" >>></a></li>'; 
else 
    a = a+'<li><a style="cursor: pointer;" onclick="return false;">></a></li><li><a style="cursor: pointer;" onclick="return false" >>></a></li>'; 
a = a+'</ul></div>'; 

Answer 1

試試這個，當你不希望用戶在點擊

<a href="javascript: void(0)">I am a useless link</a> 

Answer 2

使用跨度和一個JavaScript的onclick來代替。如果您有鏈接和「＃」href，某些瀏覽器會「跳轉」。

Answer 3

重定向你可以簡單地給它一個空的哈希：

anchor.href = "#"; 

，或者如果這不是好就夠了「禁用」，使用事件處理程序：

anchor.href = "javascript:void(0)"; 

Answer 4

安裝jquery插件並使用它

http://plugins.jquery.com/project/jqueryenabledisable

它允許您禁用/啓用頁面中的任何字段。

如果您想在某些情況下打開頁面，請編寫一個java腳本函數並從href中調用它。如果條件滿足，你打開頁面，否則什麼都不做。

代碼如下所示：

<a href="javascript: openPage()" >Click here</a> 

and function: 
function openPage() 
{ 
if(some conditon) 
opener.document.location = "http://www.google.com"; 
} 
} 

你也可以把鏈接在一個div，並設置樣式屬性爲無的顯示性能。這將隱藏div。 例如，

<div id="divid" style="display:none"> 
<a href="Hiding Link" /> 
</div> 

這將隱藏鏈接。使用一個按鈕或圖像，使現在這個div可見通過的onclick因調用該函數：

<a href="Visible Link" onclick="showDiv()"> 

and write the js code as: 

function showDiv(){ 
document.getElememtById("divid").style.display="block"; 
} 

你也可以把一個ID標籤的HTML標籤，所以這將是

<a id="myATag" href="whatever"></a> 

並通過

document.getElementById("myATag").value="#"; 

一本得到你的JavaScript此ID必須是肯定的，哈哈

Answer 5

臨屋工作NK你所有...

我用下面的代碼來解決問題：

<a href="javascript:void(0)"> >>> </a> 

Answer 6

禁用鏈接的最簡單方法就是不表現出來。每當你想測試，如果你的條件符合隱藏上一頁鍵運行此功能（與你的病情替換if (true)）：

var testHideNav = function() { 
    var aTags = document.getElementsByTagName('a'), 
     atl = aTags.length, 
     i; 

    for (i = 0; i < atl; i++) { 
     if (aTags[i].innerText == "Previous") { 
      if (true) { // your condition to disable previous 
       aTags[i].style.visibility = "hidden"; 
      } else { 
       aTags[i].style.visibility = "visible"; 
      } 
     } else if (aTags[i].innerText == "Next") { 
      if (false) { // your condition to disable next 
       aTags[i].style.visibility = "hidden"; 
      } else { 
       aTags[i].style.visibility = "visible"; 
      } 
     } 
    } 
}; 

然後運行testHideNav()每當你需要做的檢查，如果你的條件已發生改變。

Answer 7

這是可能的，太：

<a href="javascript:void(0)" onclick="myfunction()"> 

鏈接並不去任何地方，你的功能將被執行。

Answer 8

因此，上述解決方案使鏈接不工作，但不要使其可見（AFAICT）該鏈接不再有效。我遇到了一系列頁面，並希望禁用指向當前頁面的鏈接（並使其明顯禁用）。

所以：

window.onload = function() { 
    var topics = document.getElementsByClassName("topics"); 
    for (var i = topics.length-1; i > -1; i--) { 
     for (var j = topics[i].childNodes.length-1; j > -1; j--) { 
      if (topics[i].childNodes[j].nodeType == 1) { 
       if (topics[i].childNodes[j].firstChild.attributes[0].nodeValue == this.n_root3) { 
        topics[i].childNodes[j].innerHTML = topics[i].childNodes[j].firstChild.innerHTML; 
       } 
      } 
     } 
    } 
} 

這走過的鏈接列表，找到指向當前頁面之一（n_root3可能是局部的事情，但我想document必須有類似的東西），和用鏈接文本內容替換鏈接。

HTH

Answer 9

anchor.href = null; 

Answer 10

可以停用一個頁面，這種風格類的所有環節：

a { 
    pointer-events:none; 
} 

當然現在的訣竅是僅停用的鏈接，當您需要，這是怎麼做的：

使用一個空的A類，像這樣：

a {} 

然後當你要停用的鏈接，這樣做：

GetStyleClass('a').pointerEvents = "none" 

    function GetStyleClass(className) 
    { 
     for (var i=0; i< document.styleSheets.length; i++) { 
      var styleSheet = document.styleSheets[i] 

      var rules = styleSheet.cssRules || styleSheet.rules 

      for (var j=0; j<rules.length; j++) { 
      var rule = rules[j] 

      if (rule.selectorText === className) { 
       return(rule.style) 
      } 
      } 
     } 

     return 0 
    } 

注：CSS規則名稱被轉換在某些瀏覽器，以降低的情況下，這種代碼是區分大小寫的，所以最好使用此

重新鏈接小寫類名稱：

GetStyleClass('a').pointerEvents = "" 

檢查此頁http://caniuse.com/pointer-events關於瀏覽器兼容性的信息

我認爲這是做到這一點的最佳方式，但令人傷心的是，IE總是不會允許它:) 我發佈這個無論如何，因爲我認爲這包含的信息，可以是有用的，因爲有些項目使用了知道的瀏覽器，就像在移動設備上使用網絡視圖一樣。

如果你只是想停用一個鏈接（我只知道這是問題），我會使用一個函數，手動設置當前頁面的URL，或不，基於該條件。 （就像你接受的解決方案）

這個問題是容易得多比我想象:)

Answer 11

下面爲殘疾人鏈接代碼：

<a href="javascript: void(0)">test disabled link</a> 

另一種非常簡單的解決辦法是：

<a href="#">test disabled link</a> 

第一種解決方案是高效的。

Answer 12

另一種方法來禁用鏈接沒有HREF

element.removeAttribute('href'); 

錨標記會作出反應，禁用/純文本

<a> w/o href </a> 

，而不是<a href="#"> with href </a>

看到jsFiddel

希望這是heplful。

Answer 13

試試這個使用jQuery：

$(function() { 
    $('a.something').on("click", function (e) { 
     e.preventDefault(); 
    }); 
}); 

Answer 14

我也有類似的需求，但我的動機是爲了防止雙擊的鏈接。我做到了使用jQuery：

$(document).ready(function() { 
    $("#myLink").on('click', doSubmit); 
}); 

var doSubmit = function() { 
    $("#myLink").off('click'); 
    // do things here 
}; 

的HTML看起來像這樣：

<a href='javascript: void(0);' id="myLink">click here</a> 

Answer 15

而不是無效，你也可以使用：

<a href="javascript:;">this link is disabled</a> 

Answer 16

(function ($) { 
    $(window).load(function() { 
     $('.navbar a').unbind('click'); 
     $('.navbar a').click(function() { 
      //DO SOMETHING 
      return false; 
     }); 
    }); 
})(jQuery); 

我覺得這種方式更容易實行。它有你的優勢。不在你的html裏面，而是在一個不同的文件中。我認爲，沒有解綁。這兩件事仍然活躍。不確定。但在某種程度上，您只需要這一個事件

Answer 17

MDN建議element.removeAttribute(attrName);通過將屬性設置爲null（或某個其他值）來禁用它時。在這種情況下，將element.removeAttribute("href");

https://developer.mozilla.org/en-US/docs/Web/API/Element/removeAttribute

Answer 18

這是我如何禁用上點擊

$('.one-click').on("click", function (e) { 
    $(this).addClass('disabled'); 
}); 

其中.disabled類的形式來引導。

Qupte形式引導網站（here）

鏈接功能警告

的.disabled類使用指針事件：沒有嘗試禁用S的鏈路功能，但CSS屬性不但標準化。另外，即使在支持指針事件的瀏覽器中：無，鍵盤導航仍然不受影響，這意味着有視力的鍵盤用戶和輔助技術用戶仍然可以激活這些鏈接。爲了安全起見，在這些鏈接上添加一個tabindex =「 - 1」屬性（以防止它們接收鍵盤焦點）並使用自定義JavaScript來禁用它們的功能。

Answer 19

我一直在尋找簡單的東西，所以我上面的答案（提示這樣的：javascript: void(0);）合併成一個jQuery .attr()，就像這樣：

$("a").attr("href", "javascript: void(0);");