如何做动态divs - 展开崩溃循环

Question

我需要一个允许我的客户端在表单上添加更多div的函数，单击按钮（+），例如循环

这个循环应该重复div并且按钮可以添加更多div，就像照片上的下面那样

是否有人有如何做到这一点的想法？

是扩展崩溃的最佳方式吗？

非常感谢！

Answer 1

我不确定你的愿望是什么，所以我发布了两个选项：

如果要扩展隐藏的现有字段，并假设您可以使用JQUery：

<table>
    <tr>
        <th>Field1</th>
        <td><input type="text" value="" /></td>
    </tr>
    <tr>
        <th>Field2</th>
        <td><input type="text" value="" /></td>
    </tr>
    <tr class="hiddenarea" style="display: none;">
        <th>Field3 (Hidden)</th>
        <td><input type="text" value="" /></td>
    </tr>
</table>
<input id="show_hide" value="Collapse/Expand" />

<script type="text/javascript">
    $("#show_hide").click(function() {
        $(".hiddenarea").toggle();
    });
</script>

///////////////////////////////////

向表中添加新行的第二个解决方案是：

<table id="mytable">
    <tr>
        <th>Field1</th>
        <td><input type="text" value="" /></td>
    </tr>
    <tr>
        <th>Field2</th>
        <td><input type="text" value="" /></td>
    </tr>
</table>
<input id="show_hide" value="Collapse/Expand" />

<script type="text/javascript">
    $("#show_hide").click(function() {
        $("#mytable").append('<tr><td>New field</td><td><input type="text" value="" /></td></tr>');
    });
</script>