如何使用jQuery禁用多个链接

How can I disable multiple links with jQuery?

本文关键字：链接 何使用 jQuery      更新时间：2023-09-26

我有以下HTML：

<a title="Login" data-href="/MyAccount/Access/Login" 
   data-title="Admin" data-entity="n/a" 
   id="loginLink" class="nav-button dialogLink"><b>Login</b></a>
<a title="Register" 
   data-href="/MyAccount/Access/Register" 
   data-title="Admin" data-entity="n/a"
   id="registerLink" class="nav-button dialogLink"><b>Register</b></a>

当用户单击我想要的#loginLink或#registerLink时以禁用链接并调用对话框脚本。我创建了以下功能：

$("#loginLink, #registerLink")
    .click(function () {
        $('#loginLink').prop('disabled', true);
        $('#registerLink').prop('disabled', true);
        dialog(this);
    });

它正确地调用对话框，但不会禁用链接，如果我多次单击按钮会调出多个对话框盒我做错什么了吗？我不明白为什么它不起作用。

如果您想在任何时候绑定和取消绑定事件，请将代码存储在函数中，然后可以使用带名称空间的事件将事件与该函数关联起来。

function dlog(e) {
  e.preventDefault();
  dialog(this);
}
var $els = $("#loginLink, #registerLink");
$els.on('click.dlog', function(e){ dlog(e) }); // bind
$els.off('.dlog'); // unbind

编辑：另一种选择是使用仅附加一次事件的one()，然后可以在对话框关闭时再次附加事件。

$els
  .one(function(e) { dlog(e) })
  .dialog({
     beforeClose: function() { 
       $els.one(function(e) { dlog(e) });
     }
  });

您必须使用jQuery的on()和off()方法来绑定/取消绑定事件。设置disabled属性对链接没有影响，单击事件仍将被激发。

在这里，您可以找到描述和演示：http://api.jquery.com/off/

你需要像这样做

$("#loginLink, #registerLink").click(function(e) {
    e.preventDefault();
    dialog(this);
});

$("#loginLink, #registerLink").on("click", function () {
 dialog(this);
 return false;
});

jQuery中的return false将同时执行e.preventDefault和e.stopPropagation，其中第二个将防止事件冒泡，这就是您所追求的。

其他信息：event.prventDefault（）与return false

相关文章：