jQuery悬停不适用于我的列表项 [英] jquery hover not working on my list items

问题描述

我要解决一个奇怪的问题，我在使用ajax动态生成的列表项中添加了悬停功能，但没有任何反应.代码正在执行，没有任何错误，但没有任何效果. mouseenter和mouseout.警报会偶尔弹出一次，但并非每次都会弹出.我正在使用以下代码.

I am going thru a strange problem,I added hover function to my list items which are generated dynamically using ajax, but nothing is happening.The code is executing without any errors but with no effect.Even the alert is not displaying for mouseenter and mouseout.The alert pops up once in a while but not everytime.I am using the following code.

$('.category_list li').live("mouseenter", function() { 
alert('I m here');
  $(this).find('.category_list').css('text-decoration','underline');
}).live("mouseleave", function() {
alert('I m gone');
  $(this).find('.category_list').css('text-decoration','none');
}); 

我的html代码是

htmlData.push('<ul class="category_list">');
htmlData.push('<li><a href="javascript:void(0);" onclick="callGetApplicationDetails('+iIndex+',0);" >'+categoryName+'</a></li>');

由于我卡得很厉害，请帮助我.

Please help me since i am stuck very badly.

谢谢 Hemish

推荐答案

尝试使用mouseover和mouseout事件.我相信您的过滤选择器正在寻找<li>元素的父级?

Try using the mouseover and mouseout events. I believe your filtering selector was looking for the <li> elements parent?

$('.category_list li').live('mouseover mouseout', function(event) {
    if (event.type == 'mouseover') {
        alert('I m here');
        $(this).parent().css('text-decoration','underline');
    } else {
        alert('I m gone');
        $(this).parent().css('text-decoration','none');
    }
});

---

您可能可以使用新的CSS类对jQuery进行一些清理

---

and you could probably clean up the jQuery a little with a new css class

.category_list.over
{
    text-decoration: underline;
}

并使用toggleClass()

$('.category_list li').live('mouseover mouseout', function(event) {
    if (event.type == 'mouseover') { alert('I m here'); } 
    else { alert('I m gone'); }

    $(this).parent().toggleClass('over');
});

这篇关于jQuery悬停不适用于我的列表项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！