Question

假设我有这种形式：

<form action="submit" method="post">
<select name="category" id="categorylist">
<option value="love">Love</option>
<option value="magic">Magic</option>
<option value="custom">Custom</option>
</select>
<textarea name="content">SomeContent</textarea>
<input type="submit">
</form>

我想在选择自定义时将select更改为input，所以我想出了这个：

$(function(){
  $('#categorylist').change(function(){
    $(this).replaceWith('<input type="text" name="category">');
  });
  if( $('#categorylist').val() == 'custom' )
    $('#categorylist').replaceWith('<input type="text" name="category">');
});

但是当select变为输入时，我在表单提交时转储$_POST['category']时不存在$_POST。为什么会这样？

Answer 1

您应该在html中将<select>替换为</select>，将<input type="submit>替换为<input type="submit">。使用以下javascript，.replaceWith()并提交表单没有问题。

$(function(){
    $('#categorylist').change(function(){
        if( $('#categorylist').val() == 'custom' )
            $('#categorylist').replaceWith('<input type="text" name="category">');
    });
});

请参阅my test。

使用.replaceWith（）后，某些表单值未提交

1 个答案: