技術(shù)頻道導(dǎo)航
HTML/CSS
.NET技術(shù)
IIS技術(shù)
PHP技術(shù)
Js/JQuery
Photoshop
Fireworks
服務(wù)器技術(shù)
操作系統(tǒng)
網(wǎng)站運(yùn)營(yíng)

贊助商

分類(lèi)目錄

贊助商

最新文章

搜索

使用jQuery使HTML錨鏈接(HyperLink)不可點(diǎn)擊或禁用

作者:admin    時(shí)間:2019-5-8 13:12:44    瀏覽:

本文將介紹如何使用jQuery使HTML錨鏈接(HyperLink)不可點(diǎn)擊或禁用。

使HTML錨鏈接(HyperLink)不可點(diǎn)擊或禁用

使HTML錨鏈接(HyperLink)不可點(diǎn)擊或禁用

HTML禁用(disabled)屬性不適用于HTML錨鏈接(HyperLink),它們?nèi)匀皇强牲c(diǎn)擊的。

使用jQuery使HTML錨鏈接(HyperLink)不可點(diǎn)擊或禁用

以下HTML標(biāo)記由三個(gè)HTML錨鏈接(HyperLink)和一個(gè)Button組成。單擊Button時(shí),將執(zhí)行jQuery Click事件處理程序。

在此Click事件處理程序中,將檢查單擊的Button的值,如果Button的值為Disable,則禁用HTML Anchor Links(HyperLink),即不可單擊,如果Button的值為Enable,則為HTML Anchor Links( HyperLink)已啟用,即可點(diǎn)擊。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
</br>

<a href="http://m.gazebo2go.com" >webkaka.com</a><br />

<hr />
<input type="button" id="btnEnableDisable" value="Disable" />

<script type="text/javascript">
$(function () {
    $("#btnEnableDisable").click(function () {
        if ($(this).val() == "Disable") {
            $(this).val("Enable");
            $("a").each(function () {
                $(this).attr("rel", $(this).attr("href"));
                $(this).attr("href", "javascript:;");    
            });
        } else {
            $(this).val("Disable");
            $("a").each(function () {
                $(this).attr("href", $(this).attr("rel"));
                $(this).removeAttr("rel");
            });
        }
    });
});
</script>

</body>
</html>

效果如圖:

使HTML錨鏈接(HyperLink)不可點(diǎn)擊或禁用

使HTML錨鏈接(HyperLink)不可點(diǎn)擊或禁用

execcodegetcode

禁用HTML錨鏈接(HyperLink)

為了禁用HTML Anchor Link(HyperLink),將其HREF屬性的值復(fù)制到REL屬性,并將HREF屬性的值設(shè)置為空J(rèn)avaScript函數(shù)。

$("a").each(function () {
  $(this).attr("rel", $(this).attr("href"));
  $(this).attr("href", "javascript:;");
});

這使得HTML錨鏈接(HyperLink)被禁用,即不可點(diǎn)擊。

啟用HTML錨鏈接(HyperLink)

為了啟用HTML Anchor Link(HyperLink),將其REL屬性的值復(fù)制回HREF屬性,并刪除REL屬性。

$("a").each(function () {
  $(this).attr("href", $(this).attr("rel"));
  $(this).removeAttr("rel");
});
 

這使得HTML錨鏈接(HyperLink)再次啟用,即可點(diǎn)擊。

標(biāo)簽: HyperLink  
相關(guān)文章
    x
    • 站長(zhǎng)推薦
    /* 左側(cè)顯示文章內(nèi)容目錄 */