Question

请考虑以下代码：

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

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

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

轻松可以恢复，因为我想在运行AJAX调用时禁用表单输入控件。
必须在IE，FF和WebKit中工作

Answer 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; }

编辑 - 简化了评论中建议的“禁用”检查。

Answer 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;
}

在Chrome / WebKit / Safari中停用锚点

2 个答案: