避免触发多次点击事件答案

【问题标题】：Avoid triggering multiple click events避免触发多次点击事件
【发布时间】：2014-11-19 10:16:18
【问题描述】：

我试图在单击同级链接时禁用/启用输入字段。

这是我的代码。

$('a').on('click',function(){
    var inp=$(this).siblings('input');
    inp.prop('disabled', false);
    $(this).click(function(){
        inp.prop('disabled', true);
    });
});

当我第一次点击时它工作正常，但从下一次它将无法工作。因为两者都有点击功能，触发器。我无法克服这个问题。请帮帮我。

See the fiddle.

【问题讨论】：

toggle disabled attribute in jquery的可能重复

标签： javascript jquery click

【解决方案1】：

只需在每次点击时否定 disabled 属性。 elem.disabled = ! elem.disabled.

演示小提琴：http://jsfiddle.net/abhitalks/2a2ajbnb/1/

片段：

$('a').on('click',function(){
    var $inp = $(this).siblings('input');
    $inp.prop('disabled', !$inp.prop('disabled'));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="x" value="22" disabled/><a href="#">change</a>

【讨论】：

【解决方案2】：

试试这个：

$('a').on('click',function(){
    var inp=$(this).siblings('input');
    inp.prop('disabled', !inp.prop('disabled'));

});

【讨论】：

【解决方案3】：

您可以尝试使其一键完成两项工作，这可能更容易。否则，只需使用

关闭之前的点击功能

$('a').off('click');

【讨论】：

【解决方案4】：

$('a').on('click', function() {

  if ($('#ib').attr('disabled') == 'disabled') {
    $('#ib').prop('disabled', false);
  } else {
    $('#ib').prop('disabled', true);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<input id='ib' type="text" name="x" value="22" disabled/>
<a href="#">change</a>

DEMO

【讨论】：