Jquery - нажмите обработчик при использовании toggleClass

Question

вопрос лучше всего описывается на примере:

JS:

$(function() { 
    $('.classA').on('click', function() { functionA()); 
    $('.classB').on('click', function() { functionB() }); 
} 

var functionA = function() 
{ 
    alert('I am function A'); 
    $('.classA, .classB').toggleClass('classA classB'); 
} 

var functionB = function() 
{ 
    alert('I am function B'); 
    $('.classA, .classB').toggleClass('classA classB'); 
} 

Проблема просто положить, но трудно для меня, чтобы исправить: как и следовало ожидать, после нажатия класса А div, вызывается функция A, класс A переключается в класс B, но в следующий раз, когда я нажимаю тот же div, функция A все еще вызывается, тогда как я ожидаю, что тогда будет вызвана функция B. Я делаю что-то неправильно ???

Answer 1

Вы можете delegate the event от документа до элемента с соответствующим классом, а затем применить jQuery's toggleClass function к этому событию.

$(document).on('click','.classA', function() { 
     alert('I am function A'); 
     $('.classA, .classB').toggleClass('classA classB'); 
    }); 

    $(document).on('click','.classB', function() { 
     alert('I am function B'); 
    $('.classA, .classB').toggleClass('classA classB'); 
    });