Javascript JQuery列表附加项不可选

我有一个奇怪的问题，将jquery附加到列表中

<ul id="idNicheItems" class="clScrollItems ui-widget-content ui-corner-all">
    <li id="NicheItem_1"> Item 1</li>
    <li id="NicheItem_2"> Item 2</li>
    <li id="NicheItem_3"> Item 3</li>
    <li id="NicheItem_4"> Item 4</li>
</ul>

这一切都很好

在稍后的json查询之后，我将向列表中添加一个新项。当我使用firebug检查它时，它看起来就像列表中的其他项目一样-ID是唯一的-一切看起来都很好

问题是我无法突出显示或选择它

我的想法是，我必须调用上面的

“$（“#idNicheItems li”）

.hover..再次在插入节点后附加hover函数-但这似乎不起作用-除非我的bug修复中有bug

我走对了吗

回答了自己的问题——但我的代表比蚯蚓的肚脐还小——但它可能对其他人有用，所以不会删除它

看起来我的bug修复程序中有一个bug或者一个脏缓存-当然，在发布20秒后，它自己就修复了

无论如何当天的课程。在使用jQuery将新项目插入到具有相关行为的现有列表或项目集合后，请不要忘记将该行为附加到新项目

---

换句话说，为新项调用您在原始项上调用的任何选择器代码。

问题的原因是，

$（“#idNicheItems li”）。hover（…）

将仅将mouseover和out处理程序绑定到调用.hover（）时DOM树中存在的元素

您可以使用

.on（）

解决此问题，如：

$("#idNicheItems")
    .on('mouseover', 'li', function() {
        $(this).addClass("clListHighlight");
    })
    .on('mouseout', 'li', function() {
        $(this).removeClass("clListHighlight");
    });

---

出现此问题的原因是，

$（“#idNicheItems li”）.hover（..）

将仅将mouseover和out处理程序绑定到调用.hover（）时DOM树中存在的元素

您可以使用

.on（）

解决此问题，如：

$("#idNicheItems")
    .on('mouseover', 'li', function() {
        $(this).addClass("clListHighlight");
    })
    .on('mouseout', 'li', function() {
        $(this).removeClass("clListHighlight");
    });

您可以使用户live（），它绑定到DOM树的根节点，而不是元素：

$("#idNicheItems li").live('mouseover',function(){$(this).addClass("clListHighlight")});
$("#idNicheItems li").live('mouseout',function(){$(this).removeClass("clListHighlight")});

您可以使用户live（），它绑定到DOM树的根节点，而不是元素：

$("#idNicheItems li").live('mouseover',function(){$(this).addClass("clListHighlight")});
$("#idNicheItems li").live('mouseout',function(){$(this).removeClass("clListHighlight")});

与

$（“#idNicheItems li”）.hover（function（）{$（this）.addClass（“cllisthhighlight”）；}，function（）{$（this）.removeClass（“cllisthhighlight”）；

不同，您只需执行

$（“#idNicheItems li”）.hover（function（）{$（this）.toggleClass（“cllisthlightlight”）}）；

。相同的效果是代码更少：）而不是

$（#悬停（函数（）{$（this）.addClass（“clListHighlight”）；}，函数（）{$（this）.removeClass（“clListHighlight”）；

，您只需执行

$（“#idNicheItems li”）.hover（函数（）{$（this）.toggleClass（“clListHighlight”）；}

，效果相同，代码更少：

live（）

非常不受欢迎。请改用

on（）

代替。

live（）

非常不受欢迎。请改用

on（）

代替。