使用unbind()和bind ()函数

Question

嗨，我用prev/next构建了一个图像滑块。在取消绑定prev-或next按钮后，我想再次绑定它们的问题，我如何将bind()集成到我的代码中？

这是我的代码：

// for sliding right
var counter = 1;
$('#nextArrow').click(function(){
    var item_width = $('.productList li').width(); 
    var left_indent = parseInt($('.productList').css('left')) - item_width;
    $('.productList').animate({'left' : left_indent},function(){
        if( counter > $('.li_group').length - 1) {
            $('.nextArrow').addClass('disabled');
            $('.prevArrow').removeClass('disabled');
            $('#nextArrow').unbind('click');
        }
    });
    counter++;
});

// for sliding left
$('#prevArrow').click(function(){

    var item_width = $('.productList li').width();

    var left_indent = parseInt($('.productList').css('left')) + item_width;
    $('.productList').animate({'left' : left_indent},function(){
        if( counter == 1) {
            $('.prevArrow').addClass('disabled');
            $('.nextArrow').removeClass('disabled');
            $('#prevArrow').unbind('click');
        }
    });
    counter--;
});

Answer 1

您根本不需要使用bind或unbind。向#nextArrow和#prevArrow元素添加一个类，并使用 将选择器更改为只处理不包含这些类的元素。

例如，在#nextArrow单击处理程序上，可以将此类添加到#nextArrow元素中，并确保将其从#prevArrow元素中删除：

if( counter > $('.li_group').length - 1) {
    $('#nextArrow').addClass('ignore-click');
    $('#prevArrow').removeClass('ignore-click');
    ...
}

然后，您可以修改jQuery选择器，使其仅影响不具有ignore-click类的元素：

$('#nextArrow:not(.ignore-click)').click(...);

$('#prevArrow:not(.ignore-click)').click(...);