JQuery - нажмите событие с удалениемClass

Question

im создание тела слайдера, но возникла проблема. У меня есть следующая предыдущая «кнопка», которая будет перемещаться вперед и назад. Когда эти кнопки будут нажаты, он удалит класс, который заставит анимацию перемещаться вперед и назад, но когда я удалю класс, анимация все еще работает. Зачем?

делает материал:

esq = 0; 

    var navR,navL = false; 

$(".caixa_pequena").each(function(){ 
    var $element = $(this).css('left'); 
    final = parseFloat($element) + parseFloat(esq); 

    $(this).css('left', parseFloat(final) + 'px'); 
    esq = esq + 200; 
}); 

кнопку вперед:

$('.nav_depois').click(function(){ 
    desactEsq(); 
    desactDir(); 
    var nr = $(".caixa_pequena").size()-1; 
    var total = (nr * (parseInt(-200)))+ parseInt($(".caixa_pequena").css('left')) + 'px'; 
    var m = $(".caixa_pequena").offset().left+'px'; 


    if(total != m){ 
     $("#texto").animate({left: '-=200'}, 'slow', function(){ 
      /*actEsq(); 
      actDir();*/ 
     }); 
    } 
}); 

кнопку назад

$('.nav_antes').click(function(){ 
    desactEsq(); 
    desactDir(); 
    var l = $(".caixa_pequena").offset().left+'px'; 
    if(l != $(".caixa_pequena").css('left')){ 
     $("#texto").animate({left: '+=200'}, 'slow', function(){ 
     /*actEsq(); 
     actDir();*/  
     }); 
    }  
}); 

активный/desactivate

function desactDir() { 
    navR = false; 
    $('#nav_panel').find('.nav_depois').removeClass(); 
} 
function desactEsq() { 
    navL = false; 
    $('#nav_panel').find('.nav_antes').removeClass(); 
} 
function actDir() { 
    navR = true; 
    $('#nav_panel').find('#nav_next').addClass('nav_depois'); 
} 
function actEsq() { 
    navL = true; 
    $('#nav_panel').find('#nav_prev').addClass('nav_antes'); 
} 
}); 

HTML-

<div id="caixa_grande"> 
<div id="texto">  
    <div class="caixa_pequena">SPORT LISBOA E BENFICA</div> 
    <div class="caixa_pequena">SPORTING CLUBE DE PORTUGAL</div> 
    <div class="caixa_pequena">FUTEBOL CLUBE DOS COXOS</div> 
</div> 
</div> 
<div id="nav_panel"> 
    <a id="nav_next" class="nav_antes"><-------|</a> 
    <a id="nav_prev" class="nav_depois">|--------></a> 
</div> 

Answer 1

Метод Клик переплетен к элементу, когда вы делаете

$('.nav_depois').click(function(){ 
//code... 
}); 

JQuery будет искать для каждого элемента с классом nav_depois и установите функцию, которую вы прошли так будет выполняться при щелчке.

Чтобы быть более ясно, что это связывание событие, так

jQuery("element").click(f); 

переводит

jQuery("element").bind("click", f); 

Чтобы удалить метод следует использовать unbind (или off, если вы используете JQuery 1.7), например

function desactDir() { 
    navR = false; 
    $('#nav_panel').find('.nav_depois').unbind("click"); 
} 

и для его повторного подключения вы должны d это снова (с помощью методов щелчка или связывания), для этого я рекомендую хранить функцию и передавать ее как параметр, такой как:

var navAntesFunction = function(){ 
//code 
} 

$('.nav_antes').click(navAntesFunction); 

function actEsq() { 
    navL = true; 
    $('#nav_panel').find('#nav_prev').click(navAntesFunction); 
}