jquery hover live (делегат) не работает - PullRequest
0 голосов
/ 19 июля 2011

У меня есть HTML-код:

<ul class="items">
    <li class="">...</li>
    <li class="">...</li>
    <li class="">...</li>
</ul>

Мне нужен эффект наведения на каждый li, поэтому у меня есть код в jquery:

$('.items >li').live('hover', function( event ) {
    if( event.type === 'mouseenter' )  
        $(this).addClass('hover');  
    else
        $(this).removeClass('hover');  
});

странно, это не работает так, как я ожидал, если я уберу> li в селекторе следующим образом:

 $('.items').live('hover', function( event ) {
       //the same as above in here
 }

это работает на всей ул. Я также попытался делегировать, как это:

$('.items').delegate('li','hover', function( event ) {
    if( event.type === 'mouseenter' )  
        $(this).addClass('hover');  
    else
        $(this).removeClass('hover');  
});

и это тоже не работает, кто-нибудь здесь что-то замечает? спасибо за помощь.

Ответы [ 5 ]

1 голос
/ 19 июля 2011

оберните ваш код внутри

$(document).ready(function(){   

});

или короткий путь

$(function(){   

});

jsfiddle автоматически оборачивает код в обработчике document.ready

проверить, включен ли jquery

if (typeof jQuery == 'undefined') {  
    // jQuery is not loaded  
} else {
    // jQuery is loaded
}

редактировать

попробуйте использовать

$('.items li').live(

редактировать 2

live поддержка hover была добавлена ​​в 1.4.4 и позже, если вы используете более старую версию в качестве альтернативы, вы можете попробовать это

$(".items li").live({
        mouseenter:
           function()
           {
                $(this).addClass('hover'); 
           },
        mouseleave:
           function()
           {
                $(this).removeClass('hover'); 
           }
       }
    );

http://jsfiddle.net/m2SwD/1/

0 голосов
/ 23 июля 2011

li элемент уже был применен к цвету css перед его наведением, что добавляет еще один элемент css hover: #color. позднее не вступит в силу, потому что элемент li имеет два цвета CSS. это сработало, когда я удалил предыдущий.

0 голосов
/ 19 июля 2011

У вас есть определенный класс наведения CSS, который будет виден при применении?(как в поставляемом jsFiddle).

0 голосов
/ 19 июля 2011

Может быть, после> должен быть пробел, вы также можете использовать функцию find , чтобы сузить область поиска.

0 голосов
/ 19 июля 2011

У меня работает.

http://jsfiddle.net/m2SwD/

Я тестировал на FF5.

Вот код:

$(document).ready(function(){
  $('.items > li').live('hover', function( event ) {
    if( event.type === 'mouseenter' )  
        $(this).addClass('hover');  
    else
        $(this).removeClass('hover');  
  });
});
...