在 Chrome/WebKit/Safari 中禁用锚点

Posted 2023-05-08

【中文标题】在 Chrome/WebKit/Safari 中禁用锚点

【英文标题】：Disable anchors in Chrome/WebKit/Safari

【发布时间】：2010-09-15 13:39:13

【问题描述】：

考虑以下代码：

$("a").attr("disabled", "disabled");

在 IE 和 FF 中，这将使锚点无法点击，但在基于 WebKit 的浏览器（谷歌 Chrome 和 Safari）中，这没有任何作用。 disabled 属性的好处是它很容易被移除，并且不会影响 href 和 onclick 属性。

您对如何获得所需结果有任何建议吗？答案必须是：

很容易恢复，因为我想在运行 AJAX 调用时禁用表单输入控件。 必须在 IE、FF 和 WebKit 中工作

【参考方案1】：

我假设您有一个绑定到这些锚元素的 onclick 事件处理程序。只需让您的事件处理程序检查“已禁用”属性并在已设置的情况下取消该事件。您的事件处理程序将如下所示：

$("a").click(function(event)
  if (this.disabled) 
    event.preventDefault();
   else 
    // make your AJAX call or whatever else you want
  
);

您还可以设置样式表规则来更改光标。

a[disabled=disabled]  cursor: wait; 

编辑 - 按照 cmets 中的建议简化“禁用”检查。

【讨论】：

function diableForms() $("input, button, textarea, a").attr("disabled", "disabled").css("cursor", "wait"); function enableForms() $("input, button, textarea, a").not(".disabled").removeAttr("disabled").css("cursor", "");

我刚刚粘贴了我正在使用的 disableForms 和 enableForms 函数。感谢您的建议。

if(this.disabled == "disabled") 会更快

实际上我认为是 if(this.disabled) - 我真的应该在写之前检查我的 cmets

if(this.disabled) 是我使用的。我没有足够的业力来编辑帖子，否则我也会添加一些尼尔的帖子

【参考方案2】：

我必须在一个站点中修复这个行为每个锚点的代码都是单独的，这将对所有锚点起作用：

$('a').each(function () 
    $(this).click(function (e) 
        if ($(this).attr('disabled')) 
            e.preventDefault();
            e.stopImmediatePropagation();
        
    );
    var events = $._data ? $._data(this, 'events') : $(this).data('events');
    events.click.splice(0, 0, events.click.pop());
);

还有：

a[disabled] 
    color: gray;
    text-decoration: none;

【讨论】：

哇。这太棒了，应该标记为答案！这怎么会有零赞成票？！我已经开始实际修改当前答案以执行您正在做的事情，而最初没有阅读 0 upvote 答案！但是为什么你的 css 选择器不是 [disabled=disabled]，为什么不在你的 jQuery 中使用相同的选择器。

花了我一分钟来破译拼接 + 流行线。聪明的。我喜欢它实际上如何删除最后一个元素，同时将其添加到“堆栈”的前面。