jquery - 解绑挑战

Question

我试图解除绑定：

 var foo = $(".js_slide").bind('click' , function () {
  var $contentBlock = $(this).next("li[id^=content_]");

if ($contentBlock.hasClass("is_open")) {
    $contentBlock.animate({
        width: '0%'
    }).removeClass("is_open");
        } 
else {
    // if a content box is open (=> an element with the class .is_open exists), close it
    $(".js_content.is_open").animate({
        width: '0%'
    }).removeClass("is_open");
    $contentBlock.animate({
        width: '45%'        
    }, 500).addClass("is_open");      
}                               
});

使用以下代码，但出现问题，我无法弄清楚它可能是什么

$('.js_slide').unbind('click', foo);

Answer 1

从 jquery 1.7 开始，您应该使用 on/off 而不是 bind/unbind。

但是对于您的问题，您正在尝试取消绑定foo不是代码中的函数。你需要做这样的事情：

var foo = function () {
    var $contentBlock = $(this).next("li[id^=content_]");

    if ($contentBlock.hasClass("is_open")) {
        $contentBlock.animate({
            width: '0%'
        }).removeClass("is_open");
    } else {
        // if a content box is open (=> an element with the class .is_open exists), close it
        $(".js_content.is_open").animate({
            width: '0%'
        }).removeClass("is_open");
        $contentBlock.animate({
            width: '45%'
        }, 500).addClass("is_open");
    }
}

$(".js_slide").bind('click', foo);

然后你可以像这样解绑：$('.js_slide').unbind('click', foo);

Answer 2

这样做...

基本的click

$('div').on('click.name', function(){
    // do something
});

要关闭，请使用.off()

$('div').off('click.name');

PS :name随便起个名字...

演示：http: //jsfiddle.net/GpP9e/