什么在删除我注入的元素?

时间:2013-03-21 00:24:04

标签: javascript jquery dom

我正在尝试用jquery原型化UI,它允许在列表的末尾添加一对li元素。第一对顺利,但随着额外的对添加,两个早期注入的元素之一(li.box)消失。只有一个li.box将保留在页面上。我无法弄清楚原因。

HTML

<ul id="ruleset" class="ruleset">
    <li class="rule"">
        <div class="text">Rule </div>
        <select name="join" class="join">
            <option value="+">+</option>
            <option value="AND">AND</option>
            <option value="OR">OR</option>
        </select>
    </li>
</ul>

的Javascript

$(document).ready(function(){
    var liBox=$('<li>').attr('class','box').text('>');
    $('body').on('change', 'select.join', function(){ 
        var copy=$(this).parent().clone();
        var li = $(this).parent();
        var par=li.parent();
        li.after(liBox); //an item between each rule to eventually contain controls
        par.append(copy); //a copy of the rule item
    });
});

1 个答案:

答案 0 :(得分:2)

JQuery实际上不会克隆li.box而只是移动它。所以你的代码应该是:

li.after(liBox.clone());

小提琴:http://jsfiddle.net/yqXhM/1/