Javascript 表单的Jquery.append（）输入，但它们不是'；没有被张贴

我试图在用户点击add按钮时动态地将表单字段添加到表单中。然而，当我使用jquery的append（）函数时，输入看起来是正常的，但当表单提交时，它们不会发布，我被难住了。（新手）

为了解释我有一个表格：

<div class="belt">
    <div class="halfFormWrap left">        
    <form action="/myapp/invoices/add/4" id="InvoiceAddForm" method="post" accept-charset="utf-8">
        <div style="display:none;"><input type="hidden" name="_method" value="POST"/></div>
        <div class="input select"><label for="InvoiceRecurring">Recurring</label>
            <select name="data[Invoice][recurring]" id="InvoiceRecurring">
                <option value="Never">Never</option>
                <option value="Daily">Daily</option>
                <option value="Weekly">Weekly</option>
                <option value="Monthly">Monthly</option>
                <option value="Quarterly">Quarterly</option>
                <option value="Half yearly">Half yearly</option>
            <option value="Yearly">Yearly</option>
            </select></div>    
    </div>
    <div class="halfFormWrap right">
    <div id="divWithItemsTables">
        <table>
            <tr>
                <td class="widecol"><div class="input text required"><label for="Item1Details">Details</label><input name="data[Item][1][details]" maxlength="255" type="text" id="Item1Details" required="required"/></div></td>
                <td><div class="input number required"><label for="Item1Amount">Amount</label><input name="data[Item][1][amount]" step="0.01" type="number" id="Item1Amount" required="required"/></div></td>
            </tr>
        </table>
    </div>
    <div class="addbutton">+ add item</div>
    <div class="submit"><input type="submit" value="Save"/></div>
    </form>   
    </div>     
</div>

再发生
从未
每日的
周报
月刊
每季的
半年一次
每年
细节
数量
+添加项

当点击am addbutton时，我使用javascript添加新的表单字段

var count = 2;
$(".addbutton").click(function(){
    //$("#divWithItemsTables").append('<table><tr><td class="widecol"><div class="input text required"><label for="Item'+count+'Details">Details</label><input name="data[Item]['+count+'][details]" maxlength="255" type="text" id="Item'+count+'Details" required="required"/></div></td><td><div class="input text"><label for="Item'+count+'Amount">Amount</label><input name="data[Item]['+count+'][amount]" type="text" id="Item'+count+'Amount"/></div></td></tr></table>');
    count++;
});

var计数=2；
$（“.addbutton”）。单击（函数（）{
//$（“#divWithItemsTables”）.append（'DetailsAmount'）；
计数++；
});

---

但是当我提交表单时，我添加的新字段在请求中没有通过。我做错了什么？

您的html中有语法错误。移除外部关闭的

div

（

）

再发生
从未
每日的
周报
月刊
每季的
半年一次
每年
细节
数量
+添加项
html中的语法错误


var计数=2；
$（“.addbutton”）。单击（函数（）{
$（“#divWithItemsTables”）.append（'DetailsAmount'）；
计数++；
});
$（“表格”）。关于（“提交”，职能部门（e）{
e、 预防默认值（）；
log（$（this.serialize（），$（this.serializeArray（））；
})

再发生
从未
每日的
周报
月刊
每季的
半年一次
每年
细节
数量
+添加项
在
html
中显示用于发布表单语法错误的js？
<div class="belt">
    <div class="halfFormWrap left">        
    <form action="/myapp/invoices/add/4" id="InvoiceAddForm" method="post" accept-charset="utf-8">
        <div style="display:none;"><input type="hidden" name="_method" value="POST"/></div>
        <div class="input select"><label for="InvoiceRecurring">Recurring</label>
            <select name="data[Invoice][recurring]" id="InvoiceRecurring">
                <option value="Never">Never</option>
                <option value="Daily">Daily</option>
                <option value="Weekly">Weekly</option>
                <option value="Monthly">Monthly</option>
                <option value="Quarterly">Quarterly</option>
                <option value="Half yearly">Half yearly</option>
            <option value="Yearly">Yearly</option>
            </select>
      </div>    
    <!-- Remove this -->
    <!-- </div> -->
    <div class="halfFormWrap right">
    <div id="divWithItemsTables">
        <table>
            <tr>
                <td class="widecol"><div class="input text required"><label for="Item1Details">Details</label><input name="data[Item][1][details]" maxlength="255" type="text" id="Item1Details" required="required"/></div></td>
                <td><div class="input number required"><label for="Item1Amount">Amount</label><input name="data[Item][1][amount]" step="0.01" type="number" id="Item1Amount" required="required"/></div></td>
            </tr>
        </table>
    </div>
    <div class="addbutton">+ add item</div>
    <div class="submit"><input type="submit" value="Save"/></div>
    </form>   
    </div>     
</div>