jquery clone表单元素并将其插入表单中

Question

Hy,我的问题是这个http://jsfiddle.net/VZ2MK/1/

(function(){

    var input = $('.test').clone();

    $('a.add_input').on('click', function(e){

        $(this).before(input);

        e.preventDefault();

    });

})();

我需要动态添加表单的某些部分,我想我会克隆它然后添加它.它第一次工作,但如果我想不止一次添加,它停止,我的意思是它不起作用.有任何想法吗？

Answer 1

您应该每次点击都克隆它.该演示.

var input = $('.test');

$('a.add_input').on('click', function(e){
    $(this).before(input.clone());

    e.preventDefault();

});

Answer 2

问题是在before将元素插入所选元素之前,将元素从当前位置分离.你需要每次都做克隆,而不是一次:

(function(){
    $('a.add_input').on('click', function(e){
        var input = $('.test').last().clone();    

        $(this).before(input);

        e.preventDefault();
    });
})();

您的原始代码是第一次插入克隆,但在后续的情况下将其删除,然后再将其重新添加到完全相同的位置.

注意,我仅克隆last了的$('.test')项目,以避免增加1的第一次,2第二次,4第三次等等.