即使选择器被移除，Jquery的点击功能也会继续工作

Jquery click-function keeps working, even though selector is removed

本文关键字：功能 工作 继续 Jquery 选择器      更新时间：2023-09-26

我尝试通过删除用于触发javascript行为的选择器来暂时禁用一个函数。即使选择器(.next)被删除，该函数也会继续工作。

beta.art89。这是网页。点击一个项目，然后在右下角指向右的箭头来激活。

代码:

$.showElement = function( index ) {
    last_prev_object = $('#pagination .prev').clone(true);
    last_next_object = $('#pagination .next').clone(true);
    var project_html = $.parseElement(index);
    if(project_html != '') {
        $(".content-bg").html(project_html);
        $('#pagination .prev').unbind('click');
        $('#pagination .prev').bind('click', function(e) {
            e.preventDefault();
            $('#pagination .prev').removeClass('prev');
            $(".content-bg")
                .addClass('temp_content')
                .removeClass('current_content')
                .before($('<div class="content-bg current_content"></div>').html($.parseElement(current_index-1)))
                .animate({'left': '+=640px'}, 600);
            $(".content-bg.current_content")
                .css('top', '0px')
                .css('left', (parseInt($(".content-bg.temp_content").css('left'))-640)+'px')
                .animate({'left': '+=640px'}, 600, function(){$(".content-bg.temp_content").remove()});
        });
        $('#pagination .next').unbind('click');
        $('#pagination .next').bind('click', function(e) {
            e.preventDefault();
            $('#pagination .next').removeClass('next');
            $(".content-bg")
                .addClass('temp_content')
                .removeClass('current_content')
                .after($('<div class="content-bg current_content"></div>').html($.parseElement(current_index+1)))
                .animate({'left': '-=640px'}, 600);
            $(".content-bg.current_content")
                .css('top', '0px')
                .css('left', (parseInt($(".content-bg.temp_content").css('left'))+640)+'px')
                .animate({'left': '-=640px'}, 600, function(){$(".content-bg.temp_content").remove()}); 
        });
        $(".width-wrap").animate({'top': '-=275px'}, 600); 
        $(".content-bg").css('left', (640*position)+'px').animate({'top': '0px'}, 600);
    }
}

绑定事件处理程序时，它在调用.bind时被绑定到元素集。没有使用选择器，因此当您更改其中一个元素使其不再与选择器匹配时，这是而不是反映在自动添加/删除的处理程序中。

您可能需要.live，它使用选择器，并在事件触发时自动将事件处理程序绑定到选择器匹配的元素。

注释绑定$('#pagination .next')和$('#pagination .prev')按您的意愿工作。如果我没有误解你的要求的话。

当您返回到您的项目时，您是否已经使用了导航项的克隆版本?我猜你不需要再次重新绑定你的元素，因为它已经绑定了，你正在替换你的克隆元素。

$.showElement = function( index ) {
    last_prev_object = $('#pagination .prev').clone(true);
    last_next_object = $('#pagination .next').clone(true);
    var project_html = $.parseElement(index);
    if(project_html != '') {
        $(".content-bg").html(project_html);
        $('#pagination .prev').unbind('click');
        /*$('#pagination .prev').bind('click', function(e) {
            e.preventDefault();
            $('#pagination .prev').removeClass('prev');
            $(".content-bg")
                .addClass('temp_content')
                .removeClass('current_content')
                .before($('<div class="content-bg current_content"></div>').html($.parseElement(current_index-1)))
                .animate({'left': '+=640px'}, 600);
            $(".content-bg.current_content")
                .css('top', '0px')
                .css('left', (parseInt($(".content-bg.temp_content").css('left'))-640)+'px')
                .animate({'left': '+=640px'}, 600, function(){$(".content-bg.temp_content").remove()});
        });*/
        $('#pagination .next').unbind('click');
        /*$('#pagination .next').bind('click', function(e) {
            e.preventDefault();
            $('#pagination .next').removeClass('next');
            $(".content-bg")
                .addClass('temp_content')
                .removeClass('current_content')
                .after($('<div class="content-bg current_content"></div>').html($.parseElement(current_index+1)))
                .animate({'left': '-=640px'}, 600);
            $(".content-bg.current_content")
                .css('top', '0px')
                .css('left', (parseInt($(".content-bg.temp_content").css('left'))+640)+'px')
                .animate({'left': '-=640px'}, 600, function(){$(".content-bg.temp_content").remove()}); 
        });*/
        $(".width-wrap").animate({'top': '-=275px'}, 600); 
        $(".content-bg").css('left', (640*position)+'px').animate({'top': '0px'}, 600);
    }
}
如果我弄错了你的要求，请告诉我。

它不会帮助你删除。next - jQuery使用选择器来查找元素。然后向其添加事件处理程序。现在元素上有了这个处理程序——在那之后对元素做什么都没有区别，已经太迟了。

我有一种感觉，你想要.once()函数-这绑定处理程序只运行一次元素，而不是更多。

相关文章：