javascript - 在HTML中选择选项更改时更改表单字段

好吧，所以我有下面的代码

$(document).ready(function(){
  $('#Topic').change(function(){
    $('[name="keycategory[]"]').prop('disabled', false);
    selection = $(this).val();
    switch(selection)
    {
      case 'Sport':
        $('#Sport').show();
        $('#Entertainment').hide();
        $('#Entertainment[name="keycategory[]"]').prop('disabled', true);
        break;
      case 'Entertainment':
        $('#Entertainment').show();
        $('#Sport').hide();
        $('#Sport[name="keycategory[]"]').prop('disabled', true);
        break;
      default:
        $('#Sport').hide();
        $('#Entertainment').hide();
        $('#Sport[name="keycategory[]"], #Entertainment[name="keycategory[]"]').prop('disabled', true);
        break;
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="testing.php">
  <select name="Topic" id="Topic">
    <option disabled selected> -- Select Topic -- </option>
    <option value="Sport">Sport</option>
    <option value="Entertainment">Entertainment</option>
  </select>

  <!--Topic: Sport-->
  <div id="Sport" style="display:none">
    Soccer <input type="text" name="keycategory[]">
    <br>
    Basketball <input type="text" class="form-control" name="keycategory[]">
  </div>

  <!--Topic: Music-->
  <div id="Entertainment" style="display:none">
    Movie <input type="text" class="form-control" name="keycategory[]">
    <br>
    Music <input type="text" class="form-control" name="keycategory[]">
  </div>
</form>

使用上面的代码，我将得到keycategory [] = 4的大小。我的问题是，如何只发送带有所选主题的keycategory []而又不改变名称。这是因为尽管选择了主题，但我有一个php文件，该文件的功能可以接收keycategory []

最佳答案

在您的案例/开关陈述中，对其进行修改，以使它们禁用隐藏的div输入，例如

    case 'Sport':
        $('#Sport').show();
        $('#Entertainment').hide();
        $('#Entertainment [name="keycategory[]"]').attr('disabled', 'disabled');
            break;
    case 'Entertainment':
        $('#Entertainment').show();
        $('#Sport').hide();
        $('#Sport [name="keycategory[]"]').attr('disabled', 'disabled');
        break;
    default:
        $('#Sport').hide();
        $('#Entertainment').hide();
        $('#Sport [name="keycategory[]"], #Entertainment [name="keycategory[]"]').attr('disabled', 'disabled');
        break;

这将阻止他们与表单一起提交。
另外，不要忘记通过在switch语句之前启用它们来“重置”字段

    $('[name="keycategory[]"]').prop('disabled', false);
    switch(selection)
    {
       .
       .