Question

我在Jquery中使用.clone克隆了一个列表项：

 $("#coll-selected-list li:contains(" + itemName + ")").clone().addClass("avgli").appendTo("#coll-grouped-list");

但是，当我希望切换新添加的列表项时，由于某种原因它将无法工作。有什么想法吗？：

$(document).ready(function () {
    $(".avgli").toggle(function () {
        if ($(this).parent().hasClass('agg-drop')) {
            $(this).css("background", "#fff");
        }
    }, function () {
        if ($(this).parent().hasClass('agg-drop')) {
            $(this).css("background", "#676767");
        }
    }););

<ul id="coll-grouped-list" class="agg-drop">
       <li class="sortedli avgli" style="">Blah Blah</li>
       <li class="sortedli avgli" style="">Blah</li>
</ul>

Answer 1

尝试使用clone(true)代替。请参阅clone文档。

toggle函数将事件侦听器添加到元素，您需要克隆这些侦听器。

Answer 2

实例：http://jsfiddle.net/K2uke/

我已经更改了你的脚本，所以不需要双击来切换效果。

添加.clone(true)将克隆元素和事件。

.clone（ [withDataAndEvents] ）

withDataAndEventsA 布尔值，指示事件处理程序是否应该是   与元素一起复制。

参考：http://api.jquery.com/clone/

克隆后，Jquery切换不起作用

2 个答案: