克隆后,Jquery切换不起作用

时间:2012-07-04 14:43:58

标签: javascript jquery

我在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>

2 个答案:

答案 0 :(得分:1)

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

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

答案 1 :(得分:0)

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

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

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

  

.clone( [withDataAndEvents]

     

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

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