Question

所以这是我的JS：

$('.options_button').click(function() {
    $( ".new_input" ).last().clone().appendTo( ".options" );
});

这是我的HTML：

              <div class="options">
                <h2>Options</h2>
                <span class="input input--kuro">
                    <input id="inputID" class="input__field input__field--kuro" type="text" id="input-7" placeholder="..." />
                    <label class="input__label input__label--kuro" for="input-7"></label>
                </span>
                <span class="input input--kuro">
                    <input id="inputID" class="input__field input__field--kuro" type="text" id="input-8" placeholder="..."/>
                    <label class="input__label input__label--kuro" for="input-8"></label>
                </span>
                <span class="input input--kuro new_input">
                    <input id="inputID" class="input__field input__field--kuro" type="text" id="input-9" placeholder="..."/>
                    <label class="input__label input__label--kuro" for="input-9"></label>
                </span>
            </div>
            <button class="options_button">
                <i class="fa fa-plus"></i>
                <p>Option</p>
            </button>

单击我的按钮克隆包含输入（和标签）的其中一个跨度，并将其附加到其他跨度之下。我以为我很聪明，但问题在于它并不只是克隆空白输入字段，但是当输入被填充时它也会克隆输入的内容。所以清楚地克隆输入并不是前进的方向。

任何人都可以告诉我如何修改我所做的事情吗？我知道可以使用jQuery添加新输入，但我不想这样做，我想添加span的空白副本以及它包含的标签和输入。

Answer 1

试试这个

$('.options_button').click(function() {
    $( ".new_input" ).last().clone().appendTo( ".options" ).find('input').val('');
});

Example

附加包含输入的元素的副本

1 个答案: