Javascript jQuery更改属性并将其更改回

我希望在用户单击按钮之前，页面上的所有链接都不可访问

$('a').attr('href','#');

$("#button-yes").click(function(){
    $('a').attr('href',function(){
        $(this).attr('href');
    });
});

---

只是跟踪状态而不是重写所有的HREF怎么样

var buttonClicked = false;

$('a').click(function(){
  if(! buttonClicked) {
    return false;
  }
});

$("#button-yes").click(function(){
    buttonClicked = true;
});

---

在函数外有一个var，它表示如下内容：

button_clicked = false;

然后使用此选项禁用所有链接

$('a').click(function(){
   if(!button_clicked){
      return false;
   }
});

---

返回false将导致链接不执行任何操作。

您需要隐藏href的值，以便以后可以恢复该值。我将把href值隐藏到rel属性中

$('a').each(function(){
    $(this).attr('rel', $(this).attr('href'));  //store the href values
    $(this).attr('href', '');  //clear the href values
});

$("#button-yes").click(function(){
    $('a').each(function(){
        $(this).attr('href', $(this).attr('rel'));  //recover the href values
    });
});

这是一种简单的方法，但它将地址保留在rel属性中。聪明的用户可能会发现并使用它来绕过您的按钮，所以这里有@rsp建议的另一种方法

$('a').each(function(){
    $(this).data('link', $(this).attr('href'));  //store the href values
    $(this).attr('href', '');  //clear the href values
});

$("#button-yes").click(function(){
    $('a').each(function(){
        $(this).attr('href', $(this).data('link'));  //recover the href values
    });
});

---

通过使用.data（）存储href，链接地址更加模糊，因此用户不应轻易绕过该按钮（尽管禁用JavaScript将完全避免此操作）。

最简单的示例是劫持所有链接的单击事件：

$('a').live('click.disable', function() {
    return false;
});

$("#button-yes").click(function() {
    $('a').die('click.disable');
});

（看这把小提琴：）但是任何人都可以右键点击链接并在新标签或类似的东西中打开它

另一个示例是将href属性存储为数据并在以后还原：

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

$("#button-yes").click(function() {
    $('a').each(function() {
        var $this = $(this);
        $this.attr('href', $this.data('href'));
    });
});

（请看这把小提琴：）这里的链接不起作用，因为它们都指向当前页面上的“#”

另一个示例是基本上执行相同的操作，但完全删除href属性，使链接看起来像普通文本，直到单击按钮：

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

$("#button-yes").click(function() {
    $('a').each(function() {
        var $this = $(this);
        $this.attr('href', $this.data('href'));
    });
});

---

（请看这把小提琴：）

我认为这个解决方案之所以出现，是因为它更有效，工作量更少，并且解决了这个问题。这就是为什么懒惰的程序员是最好的：）你的例子没有禁用链接——它们仍然有效。将href属性存储在rel属性中，但不删除href属性。另外，为了在dom节点上存储任意数据，您可以在jQuery中使用.data（）。@rsp:很好的调用。我去的时候忘了禁用链接。我意识到数据可能更好，但是对于rel有一些东西需要说明——例如，代码中的链接仍然是人类可读的，因此您可以验证链接应该放在哪里。在本例中，这可能是一个不利因素，因此我将发布一个使用.data（）的替代版本