Question

我尝试禁用点击事件，并在点击该项目后禁用div。我无法实现此功能。有帮助吗？ What I have tried

<div class="ordrClone">
                       Image 1
                    </div>
<div class="ordrClone">
                       Image 2
                    </div>
<div class="ordrClone">
                       Image 3
                    </div>

<div>
   <input type="button" id= "btnCancel" value="Enable"> 
</div>

 $('.ordrClone').click(function () {
        $('.ordrClone').not(this).each(function() {
            $(this).off('click');
        });
    });

$('#btnCancel').click(function () {
     $('.ordrClone').each(function() {
            $(this).on('click');
        });
});

Answer 1

使用$(this)代替：

$('.ordrClone').not($(this)).each(function() {

还创建一个回调函数并在on方法上使用该回调：

$（this）.on（＆＃39;点击＆＃39;）; //这是错误的做法。

$(this).on('click',callback);

请参阅on method了解更多详情

但如果您只想使用该功能一次，则可以使用one method代替方法。

Answer 2

一个简单的解决方案是

$(document).on('click', '.ordrClone:not(.disabled)', function () {
    console.log('clicked')
    $('.ordrClone').not(this).addClass('disabled');
});

$('#btnCancel').click(function () {
    $('.ordrClone').removeClass('disabled');
});

演示：Fiddle

Answer 3

使用one()代替on()，

$('.ordrClone').one('click',function () {
      // your code worked once
});

Live Demo

Answer 4

如果您只想点击一次

，则可以使用One

$(document).one('.ordrClone','click',function () {
        $('.ordrClone').not(this).each(function() {
            $(this).off('click');
        });
    });

Answer 5

$（“＃btnCancel”）。点击（function（）{$（this）.unbind（'click'）;}

这应取消绑定您刚刚点击的项目的“点击”功能。您可以通过许多不同的方式禁用元素。一个非常流行的方法是.hide（）编写代码并在需要时使用它，但上面的代码可以正常工作以禁用表单元素中的特定事件。

Jquery禁用div并禁用单击它

5 个答案: