Question

我有三组表单字段，由jQuery和Select列表显示和隐藏。

他们正在展示我想要的东西。但是现在从前两组传递给php代码的信息正在丢失，如果底部的三个字段是使用的集合。信息传递没问题。

这是一个类似命名的项目在页面下方删除页面上部项目信息的情况吗？

我如何解决这个问题？

            <ul id="options">
                <li>
                    <h2>Your guest names</h2>
                    <label for="GuestName">Guest:</label>&nbsp;<input type="text" style="width:180px;" name="GuestName" id="GuestName" /><br/>
                </li>
                <li>
                    <h2>Your guest names</h2>
                    <label for="GuestName">Guest:</label>&nbsp;<input type="text" style="width:180px;" name="GuestName" id="GuestName" /><br/>
                    <label for="GuestName2">Guest 2:</label>&nbsp;<input type="text" style="width:180px;" name="GuestName2" id="GuestName2" /><br/>
                </li>
                <li>
                    <h2>Your guest names</h2>
                    <label for="GuestName">Guest:</label>&nbsp;<input type="text" style="width:180px;" name="GuestName" id="GuestName" /><br/>
                    <label for="GuestName2">Guest 2:</label>&nbsp;<input type="text" style="width:180px;" name="GuestName2" id="GuestName2" /><br/>
                    <label for="GuestName3">Guest 3:</label>&nbsp;<input type="text" style="width:180px;" name="GuestName3" id="GuestName3" /><br/>
                </li>

            </ul>
            <script>
                $("li").hide();

                $("#numberattending").change(function() {
                    var index = $(this).children(":selected").index();
                $("#options").children().hide().eq(index).show();
                });
            </script>

Answer 1

隐藏这些字段时，请尝试禁用它们。这将阻止他们与表单一起提交。当然，当你展示它们时，你必须重新启用它们。

尝试这些更改（您的代码已经过修改，替换为新代码）：

// $("#options").children().hide().eq(index).show();
$("#options").children().hide().find('input').prop('disabled', true);
$("#options").children().eq(index).show().find('input').prop('disabled', false);

更好的方法可能是在调用hide()时使jQuery触发“隐藏”事件并在发生时禁用输入（类似于show()）：

// taken from http://stackoverflow.com/a/2857952/259457
var _oldhide = $.fn.hide;
$.fn.hide = function(speed, callback) {
    $(this).trigger('hide');
    return _oldhide.apply(this,arguments);
}

$('#options li').on('hide', function() {
    $(this).find('input').prop('disabled', true);
});

然后，您可以将代码与代码的其余部分保持一致，当您在show()代码上调用hide()或li时，字段将自动停用/启用。< / p>

Answer 2

这是一个类似命名的项目在页面下方删除页面上部项目信息的情况吗？

是的..当表单发布时...表单中的字段按名称发布，在您的情况下，三个输入具有相同的名称，因此它正在替换，只有一个被发布...单向是给它一个独特的名字..

或禁用除一个以外的所有其他字段，以便它不会发布..

试试这个

 $("#numberattending").change(function() {
      var index = $(this).children(":selected").index();
      $("#options").find('input').prop('disabled',true);
      $("#options").children().hide().eq(index).show().find('input').prop('disabled',false);
 });

表单字段集已停止将信息传递到数据库

2 个答案: