如何删除onclick功能并通过jquery使用相同的功能启用它？答案

【问题标题】：How to remove the onclick function and enable it using the same function through jquery?如何删除onclick功能并通过jquery使用相同的功能启用它？
【发布时间】：2013-02-28 18:52:05
【问题描述】：

我有以下代码。我想要实现的是，当我单击 1 时，它应该禁用 1 onclick 功能并且剩余的需要可用。当我单击 2 时，1 和 3 需要 onclick 功能但是2不需要。

我需要实现分页。我该怎么做。

<div class="test">
  <a href="javascript:void(0);" onclick="test1(1);">1</a>
  <a href="javascript:void(0);" onclick="test1(2);">2</a>
  <a href="javascript:void(0);" onclick="test1(3);">3</a>
</div>

function test1(val)
  {
    $(this).attr('onclick','').unbind('click');
            alert("hai");
  }

但我每次都会收到警报。

【问题讨论】：

标签： jquery onclick disable-link

【解决方案1】：

我想你想禁用最后点击按钮的功能。你可以这样做：

<div class="test">
  <a href="javascript:void(0);" onclick="test1(1);">1</a>
  <a href="javascript:void(0);" onclick="test1(2);">2</a>
  <a href="javascript:void(0);" onclick="test1(3);">3</a>
</div>

Javascript

var lastClickedInt;
function test1(val)
  {
    if (val !== lastClickedInt) {
        lastClickedInt = val;
        alert("hai");
    }
  }

【讨论】：

【解决方案2】：

最好的方法是使用类和事件委托：

<div class="test">
  <a href="javascript:void(0);" onclick="test1(1);">1</a>
  <a href="javascript:void(0);" onclick="test1(2);">2</a>
  <a href="javascript:void(0);" onclick="test1(3);">3</a>
</div>

$('div.test').on('click','a',function(e) {
  if(!$(this).hasClass('disabled')) {
    //you're event delegation code
  }

  //disable this link and "enable" it's siblings
  $(this).addClass('disabled').siblings().removeClass('disabled');
});

【讨论】：