動態Javascript表單輸入不發布

Question

我正在使用python-flask框架開發Web應用程序。

我遇到的麻煩是用戶可以在其中創建新輸入字段的表單上。 表單以HTML代碼形式出現，並以可視方式出現在瀏覽器中，但是動態創建的元素不會出現在POST請求中。

以下是兩個javascript函數，第一個在用戶按下相應按鈕時創建form元素。 我在網上找到的第二個代碼，因為它說序列化會將動態表單元素添加到POST請求中。

$(function create_new_row_plus_button_fn() {
$("#addRows").click(function () {
            counter = counter + "a";
            var trelem = document.createElement('tr');
            var tdelem = document.createElement('td');
            trelem.appendChild(tdelem);
            var frm = document.getElementById("new_table_id");
            var newEl = document.createElement("input");
            newEl.name = counter;
            newEl.type = "text";
            tdelem.appendChild(newEl);
            frm.appendChild(trelem);
    });
})

$('#form_container').on('submit', function(e) {
    //prevent the default submithandling
    e.preventDefault();
    //send the data of 'this' (the matched form) to yourURL
    $.post('/add_new_product', $(this).serialize());
    location.reload();
});

我注意到的一件事是，如果我從chrome調試器中查看html，則動態表單元素是可見的，但是如果查看頁面源，則看不到它們。

Answer 1

問題發生在元素內部。 將外部移動解決了該問題。