Jquery添加未传递给php的输入数组字段

Question

我有一个简单的表单，jquery 在我的表单中添加了无限的输入字段。问题是当 jquery 添加一个字段时，它实际上并没有在提交时发布任何值。任何想法如何调试这个？这是我的代码：

<script  src="../orders/src/jquery.min.js"></script>
<script type="text/javascript">
    $(function() {
        var addDiv = $('#addinput');
        var i = $('#addinput p').size() + 1;

        $('#addNew').live('click', function() {
            $('<p><input type="text" id="p_new" size="40" name="item[]" value="" placeholder="Input here" /><a href="#" id="remNew">Премахни</a> </p>').appendTo(addDiv);
            i++;
            return false;
        });

        $('#remNew').live('click', function() {
            if( i > 2 ) {
                $(this).parents('p').remove();
                i--;
            }
            return false;
        });
    });
</script>
<form action="add-exe.php" method="post">
      <div id="addinput">
        <p>
           <a href="#" id="addNew">Add line</a>
        </p>
        <input type="submit" value="Запази">
    </div>
</form>

这是一个简单的 php 端，它试图读取添加到数组中的内容。到目前为止，通过 Jquery 添加的字段没有通过

$itemlist = count($_POST['item']) ? $_POST['item'] : array();
print_r(array_values($itemlist));

如果输入字段不是动态添加的 - 表单发布数组就好了

Answer 1

您应该使用 on 而不是 live。此外，添加侦听器以删除字段的代码也应在每次添加后调用：

var addDiv = $('#addinput');
var i = $('#addinput p').size() + 1;

$('#addNew').on('click', function() {
    $('<p><input type="text" id="p_new" size="40" name="item[]" value="" placeholder="Input here" /><a href="#" class="remNew">Премахни</a> </p>').appendTo(addDiv);
    i++;
    assignRemoveEvents();
});

var assignRemoveEvents = function() {
    $('.remNew').off('click').on('click', function() {
        if( i > 2 ) {
            $(this).parents('p').remove();
            i--;
        }
    });
}

完成此操作后，您应该将数据导入 PHP。如果您发布您的 php 代码，我们可能会找出问题所在。