#javascript #jquery
#javascript #jquery
Вопрос:
У меня есть навигация, которая исчезает и исчезает цвет текста при наведении курсора мыши. Он делает это на основе неактивного класса.
Он работает отлично, за исключением страницы, которая изначально активна.
Когда я меняю страницы (через ajax) Я добавляю «неактивный» класс к элементу, который ранее был «активным», но моя функция не замечает его как такового. В веб-инспекторе я вижу, что активный класс удаляется, а неактивный класс добавляется правильно. Есть предложения?
('header#primary nav a.inactive').hover(
function(){
$(this).stop().animate({'color': '#ffffff'}, 'slow');
},
function() {
$(this).stop().animate({'color': '#a2a2a2'}, 'slow');
});
Ответ №1:
Вам нужно использовать live
функцию jquery для динамически добавляемых элементов.
$('header#primary nav a.inactive').live('mouseenter' ,function(){
$(this).stop().animate({'color': '#ffffff'}, 'slow');
}).live('mouseleave',
function() {
$(this).stop().animate({'color': '#a2a2a2'}, 'slow');
});
Ответ №2:
Короткий ответ: вместо этого используйте функции .live() или .delegate() . Документ jQuery дает объяснение того, как они работают, и единственная проблема hover()
, с которой вы столкнетесь, это то, что вместо метода быстрого доступа вам нужно будет выполнить комбинацию mouseenter()
и mouseleave()
.
Средний ответ:
Когда вы назначаете обработчики событий (будь то наведение, щелчок, что угодно) непосредственно на основе селектора jQuery, например, вашего кода:
$('header#primary nav a.inactive').hover( /* your code */ );
В нем говорится: «найдите все элементы DOM, которые соответствуют селектору прямо в этот момент, и назначьте им обработчик событий (наведите курсор)». Он определенно не следит за тем, когда элементы могут быть изменены, чтобы соответствовать селектору в будущем, и не удаляет обработчики из элементов, если они изменены таким образом, что они больше не совпадают.
Вместо этого вы хотите использовать .live() или .delegate() , которые будут обрабатывать события для элементов, которые соответствуют селектору сейчас или в будущем.
Длинный ответ: упс, у меня нет времени писать это, и на самом деле вам не нужно, чтобы я объяснял, как .live() и .делегировать (), когда они описаны в документе jQuery.