有人知道如何在jquery中禁用一个链接而不使用return false吗?

具体来说,我要做的是禁用一个项目的链接,使用jquery执行点击它触发一些东西,然后重新启用该链接,以便如果它再次单击它作为默认工作。

谢谢。 戴夫

更新 这是代码。在应用.expanded类之后,它需要做的是重新启用被禁用的链接。

$('ul li').click(function(e) {
    e.preventDefault();
    $('ul').addClass('expanded');
    $('ul.expanded').fadeIn(300);
    //return false;
});

当前回答

作为后端工程师,我花了一段时间来思考如何做到这一点,但下面是我如何解决完全相同的问题。

const resendCodeTimeOutPeriodInMs = 30000; // 30seconds.

function resend2faCodeOnLogin(sendByEmail) {

const resendCodeLinkElement = $('#resendCodeLink');

const disabledState = resendCodeLinkElement.attr('disabled');
if (disabledState === 'disabled') {
    resendCodeLinkElement.preventDefault();
} else {
    resendCodeLinkElement.attr("disabled", true);
    resendCodeLinkElement.addClass('disabled');

    submitForm('#twoFactorResendCodeForm', (response) => {
        setTimeout(function () {
            $('#resendCodeLink').removeClass('disabled');
            resendCodeLinkElement.attr("disabled", false);
        }, resendCodeTimeOutPeriodInMs); 

    }, (response) => {
        console.error(response);
    });
}
}

标准CSS摘自网络上著名的例子:

a.disabled {
opacity: 0.5;
pointer-events: none;
cursor: default;

我的方法是确保一个给定的按钮在用户体验可以再次点击它之前被禁用30秒。

其他回答

你可以隐藏和显示你喜欢的链接

$(link).hide();
$(link).show();

试试这个:

$("a").removeAttr('href');

编辑-

从您更新的代码:

 var location= $('#link1').attr("href");
 $("#link1").removeAttr('href');
 $('ul').addClass('expanded');
 $('ul.expanded').fadeIn(300);
 $("#link1").attr("href", location);

如果您使用href路径,则可以保存它

禁用:

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

然后重新启用使用:

$('a').each(function(){
    $(this).attr("href", $(this).data("href"));
});

在一种情况下,我不得不这样做,因为点击事件已经绑定到其他地方,我无法控制它。

对于像我这样通过谷歌来到这里的人,这里有另一种方法:

css:
.disabled {
  color: grey; // ...whatever
}

jQuery:
$('#myLink').click(function (e) {
  e.preventDefault();
  if ($(this).hasClass('disabled'))
    return false; // Do something else in here if required
  else
    window.location.href = $(this).attr('href');
});

// Elsewhere in your code
if (disabledCondition == true)
  $('#myLink').addClass('disabled')
else
  $('#myLink').removeClass('disabled')

记住:这不仅是一个css类

类=“按钮样式”

还有这两个

类= " buttonstyle禁用"

所以你可以很容易地添加和删除更多的类与jQuery。没必要碰它…

我爱jQuery!: -)

你应该在这里找到答案。

感谢@威尔和@马特的优雅解决方案。

jQuery('#path .to .your a').each(function(){
    var $t = jQuery(this);
    $t.after($t.text());
    $t.remove();
});