如何在 JavaScript 中禁用 href 链接？

javascript html

2022-08-30 05:00:43

我有一个标签，在某些情况下，我希望完全禁用此标签。<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>';

答案 1

当您不希望用户在点击时重定向时，请尝试此操作

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

答案 2

您可以使用以下样式类停用页面中的所有链接：

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一如既往，不会允许它:)无论如何，我都会发布这个，因为我认为这包含有用的信息，并且因为有些项目使用已知的浏览器，例如当您在移动设备上使用Web视图时。

如果您只想停用一个链接（我只意识到这是问题所在），我将使用一个函数，该函数可以根据该条件手动设置当前页面的URL，或者不手动设置。（就像你接受的解决方案一样）

这个问题比我想象的要容易得多:)