添加点击返回到未绑定事件答案

【问题标题】：Add click back to unbinded event添加点击返回到未绑定事件
【发布时间】：2011-09-20 14:20:15
【问题描述】：

当我运行以下代码时，我只希望 #overlay、#image + theNumber 和 #close 处于活动状态，因此我禁用了 $('.box').click 但是一旦单击 #close 我想重新启用对 $('.box') 的点击，但到目前为止我无法做到。我已经检查了其他答案，但无法将其放在一起。感谢您的帮助！

【问题讨论】：

标签： jquery click bind unbind

【解决方案1】：

看起来您所缺少的只是在您的 #close 点击处理函数中重新绑定 .box 点击事件

$('#close').click(function() {
    $('#overlay').fadeOut();
    $('#image' + theNumber).fadeOut();
    $('#close').fadeOut();
    $('.box').click(handler);
});

http://jsfiddle.net/pxfunc/gUP68/

【讨论】：

【解决方案2】：

如果我是你，我会这样做：

var handler = function() {
    var $box = $('.box');
    if($box.hasClass('disabled')){
       // do nothing, just disallow further spawns
   } else{
        $box.addClass('disabled');
        var theIDval = $(this).attr('id');
        var theNumber = theIDval.replace('box','');

        // no need to unbind, remove this
        // $('.box').unbind('click');

        $('#overlay').show();
        $('#image' + theNumber).fadeIn();
        $('#close').fadeIn();

        $('#close').click( function () {
            $('#overlay').fadeOut();
            $('#image' + theNumber).fadeOut();
            $('#close').fadeOut();
            $box.removeClass('disabled'); // re-enable click
        });
   }
};

$(document).ready( function() {
    $('.box').click(handler);
});

【讨论】：

这也有效，但另一个答案更简洁。谢谢你的帮助！