javascript - 如果已经在页面上，jQuery 禁用链接

Question

我有这个 jquery 代码，当用户单击列表中的链接时，它会动态地将 html 页面加载到 div 中。

如果用户已经在查看它链接到的页面，是否有办法禁用其中一个链接？现在，每次单击链接时都会触发加载动画，即使请求的链接已经显示。

如果它调用和加载的页面已经显示，我需要事件不触发。

$('#navigation a').click(function(){

    var toLoad = $(this).attr('href')+' #content';
    $('#content').hide("slide",{direction:"up"},1000,loadContent);
    window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
    function loadContent() {
        $('#content').load(toLoad,'',showNewContent())
    }
    function showNewContent() {
        $('#content').show("slide",{direction:"down"},1000);
    }
    return false;

});

Answer 1

您可以添加一个自定义类来禁用您点击的链接。喜欢:

$('#navigation a').click(function(){
  ......
  $(this).addClass('disabled');
  ....
}

但是您显然需要以某种方式从其他先前添加的链接中删除该类(这样您就不会在点击几下后禁用整个菜单。因此您可以进行一些重置，例如:

$('#navigation a').click(function(){
  ......
  $('#navigation a').removeClass('disabled');
  $(this).addClass('disabled');
  ....
}

这只是一个简单的逻辑。我相信它可以优化或以不同的方式编写。

编辑:在这种情况下，Css 类可能不会成功。我不确定是否可以在 anchor 标记上使用 disable()。或者您可以只执行不同的逻辑，例如在此链接上使用 preventDefault，但是您仍然需要以这种方式跟踪禁用的元素，以便您可以在单击另一个元素时启用它们。