如何有效停用 HTML 連結？

禁用 HTML 鏈接

可以通過多種方式禁用鏈接，每種方式都有自己的優點和缺點。

1。 CSS 方法（建議）

a.disabled {
    pointer-events: none;
}

此方法是首選，因為它提供了便攜式解決方案。然而，像 Internet Explorer 這樣的舊瀏覽器並不完全支援指標事件。要解決此問題，請考慮使用停用屬性：

a[disabled] {
    pointer-events: none;
}

2。焦點攔截

您可以使用 tabindex 來防止連結被聚焦，從而無法透過鍵盤存取它們：

<a href="#" disabled tabindex="-1">...</a>

請注意，此方法不會阻止點擊事件。

3。攔截點擊(JavaScript)

使用JavaScript 事件監聽器攔截連結點擊並檢查停用標誌：

$("td > a").on("click", function(event){
    if ($(this).is("[disabled]")) {
        event.preventDefault();
    }
});

4.清除連結

刪除href屬性以使連結不起作用：

$("td > a").each(function() {
    this.data("href", this.attr("href"))
        .attr("href", "javascript:void(0)")
        .attr("disabled", "disabled");
});

5.假點擊處理程序

新增一個回傳 false的點擊處理程序以停用連結：

$("td > a").attr("disabled", "disabled").on("click", function() {
    return false; 
});

設定停用連結的樣式

使用停用屬性或類別以停用樣式連結：

a[disabled] {
    color: gray;
}

ARIA 支援

包含aria-disabled="true" 以及已停用的屬性/類，以確保螢幕閱讀器的可訪問性。

以上是如何有效停用 HTML 連結？的詳細內容。更多資訊請關注PHP中文網其他相關文章！