javascript - 如何使用 JS/Jquery 单击同一个按钮来重复 html 代码 10 次？

Question

我希望能够在名为:<div id="add_remove_product_name">的div下显示同一段html代码10次通过单击名为:<button id="add_another_product_name"> 的按钮。我想我需要某种 for 循环来完成这项工作，但不确定。任何建议都会有帮助，谢谢。

我的 HTML 代码:

<div id="product_name">
    <input id="skriv_produktnavn" placeholder="Skriv Produktnavn her" required></label>

    <button id="add_another_product_name">Tilføj endnu et produktnavn</button>

    <div id="add_remove_product_name">
        <input id="added_product_name" placeholder="Skriv Produktnavn her" required></label>
        <button id="remove_product_name">X</button>
    </div>

Answer 1

使用 for 循环连接 10 个 HTML 代码副本。然后使用 .after() 将其放在 DIV 后面。

$("#add_another_product_name").click(function() {
    var html = '';
    for (var i = 0; i < 10; i++) {
        html += 'html code that you want to repeat';
    }
    $("#add_remove_product_name").after(html);
}