Событие jQuery click не работает на нескольких экранах

Question

Я использую jQuery 1.4.2. Используя селектор CSS «span.accordionOn», я обрабатываю событие click. На экране один, он работает нормально. Где, когда я перехожу к следующему экрану, функции не вызываются.

Обработчики jQuery приведены ниже. Я сохраняю их в файле js и загружаю файл js для каждой загрузки страницы.

$("span.accordionOn").click(function(event){ 
    $(this).parents(".toggleOuterCustom"); 
    $(this).parents(".toggleOuterCustom").find(".lHeight").toggleClass('lHeighttranslate'); 
    return false; 
    }); 




// toggle link icon 
    $('span.accordionOn').click(function(){ 
    $(this).toggleClass('accordionOff'); 
    }); 

Answer 1

Не видя больше кода будет трудно найти точный вопрос, но вот догадка:

$(document).on("click", "span.accordionOn", function(event){ 
    $(this).toggleClass('accordionOff'); //I merged the 2 functions 
    $(this).parents(".toggleOuterCustom"); 
    $(this).parents(".toggleOuterCustom").find(".lHeight").toggleClass('lHeighttranslate'); 
    return false; 
    }); 

Попробуйте приведенный выше код. Если это работает, то проблема заключается в следующем:

• привязывается обработчик события для всех span.accordionOn элементов, которые в настоящее время в документе
• Однако, если вы добавляете новые span.accordionOn элементов после этого, событие будет не связаны с ними
• on событие будет работать для всех текущих и будущих span.accordionOn предметов, которые когда-либо будет в документе, который решает эту проблему

Answer 2

Я нашел проблему. да, вы правы, элементы не существуют, когда я пытаюсь связать.

Однако с jQuery 1.4.2 'on()' не существует и используется 'live'. Вот код.

$("span.accordionOn").live('click',function(event){ 
    $(this).parents(".toggleOuterCustom"); 
    $(this).parents(".toggleOuterCustom").find(".lHeight").toggleClass('lHeighttranslate'); 
    return false; 
    });