JQuery selector -

Question

Я схожу с ума, пытаясь понять, почему мой код не работает.

Я устанавливая Lī элемент с активным классом, который работает ..

я тогда хочу, чтобы выбрать этот элемент LI, который имеет класс «активный» - и дать ему функцию щелчка, которая скользит другой DIV в поле зрения , который также определяется классом «активного»

вот мой код:

$(".contentPanel").click(function() { 
    $(this).siblings().animate({height: minHeight,},500).removeClass("active"); 
    $(this).animate({height: maxHeight,},500).addClass("active"); 
    $('li').removeClass("active"); 
    $(this).children('ul').children('li').addClass("active"); 
    $('.infoPanelSlider').removeClass("active"); 
    $(this).children('.infoPanelWindow').children('.infoPanelSlider').addClass("active"); 
}); 

Вышеуказанные работы, литиево элементы внутри активного «» contentPanelSlider приведены класс активен.

Следующий бит, где я "м застрял:

Я хочу написать это:.

$ ('li.active') нажмите (функция() .... сделать что-то

но «активная часть, похоже, не работает - она ​​работает, если я просто нацеливаю« ли », без активного выбора класса ...

Мне интересно, связано ли это с тем, что активный класс был добавлен JQuery «на лету», а не жестко закодирован в таблице стилей, но это завершено е предположение ..

Пожалуйста, помогите, если вы можете, я не возражаю получать пылали ...

Answer 1

Вы можете прикрепить обработчик ко всем li и проверить, есть ли они класс active:

$('li').click(function() { 
    if($(this).is('.active')) { 
     // do more 
    } 
}); 

Даже лучше (если у вас много li) до delegate мероприятия. Это добавит только один обработчик события (тогда как предыдущее решение добавит обработчик события в каждый элемент li и, следовательно, потребляет больше памяти). Вам просто нужно иметь общий предок:

ancestor.delegate('li.active', 'click', function() { 
     // do more 
}); 

---

$('li.active') будет работать только в том случае, если li s есть этот класс в тот момент, когда вы назначаете обработчик не тогда, когда обработчик выполняются. Таким образом:

$(".contentPanel").click(function(){}); 
$("li.active").click(function(){}); 

не будет работать, если нет li элементов с этим классом еще, но это

$(".contentPanel").click(function() { 
    // add class to li 
    $('li.active').click(function(){}); 
}); 

будет работать. Но он также каждый раз добавляет обработчик событий, поэтому лучше назначать один раз и тестировать.

Answer 2

Да, ваши подозрения верны. Селекторы jQuery разрешаются во время выполнения. Если вы ищете li.active во время стартового сайта, ничего не найдено. jQuery предлагает live() и delegate(), которые могут обойти эту проблему, проверив каждое событие click на более высоком уровне.

// will match any click event on any li with the class active when it is clicked: 
$('li.active').live('click', function() { 
    alert('Active Clicked'); 
}); 

Answer 3

Да. Это происходит потому, что класс был добавлен «на лету». Используйте функцию jquery для привязки события click к li

$ ('li.active'). Live ('click', function() { // Сделайте что-нибудь. });

Answer 4

Если жить не работает, вы можете попробовать привязку:

$('li.active').bind('click',function(){ 
//do something 
});