Question

我正在尝试创建一个包含两个问题的表单，其中第一个问题的答案（复选框）成为第二个问题（选择框）的选择。以下是两个问题：

问题1：你在哪所大学打棒球？（复选框）
问题2：在这些学校中，您最喜欢哪个棒球场/体育场？（选择框）

第一个问题的答案需要自动填充选择字段。

似乎第一步是根据问题1的答案创建一个数组。这是我到目前为止所拥有的。此脚本实时将答案写入页面。我的想法是确保我抓住答案。我遇到的问题是如何根据第一个问题的答案构建第二个问题。

<form>
  <input type="checkbox" name="check" value="University of Alabama" id="University of Alabama">
  <label for="ch1">University of Alabama</label><br>
  <input type="checkbox" name="check" value="Florida" id="University of Florida">
  <label for="ch2">University of Florida</label><br>
  <input type="checkbox" name="check" value="Georgia" id="University of Georgia">
  <label for="ch3">University of Georgia</label><br>
  <input type="checkbox" name="check" value="University of North Carolina" id="University of North Carolina">
  <label for="ch4">University of North Carolina</label><br>
  <input type="checkbox" name="check" value="University of South Carolina" id="University of South Carolina">
  <label for="ch4">University of South Carolina</label>
</form>

<p><b>Results:</b> <span id="results"></span></p>

<script>
  function showValues() {
    var fields = $( ":input" ).serializeArray();
    $( "#results" ).empty();
    jQuery.each( fields, function( i, field ) {
      $( "#results" ).append( field.value + " " );
    });
  }

  $( ":checkbox, :radio" ).click( showValues );
  $( "select" ).change( showValues );
  showValues();
</script>

Answer 1

快速注意 - 我建议您为复选框输入使用array名称，如下所示：

<input name="check[]" value="..." />

话虽如此，这是一个快速而肮脏的解决方案，可能会让你朝着正确的方向前进。您可以使用您想要的任何处理程序调用{{1}}。

showValues()

注意 - 请记住，此功能不是很抽象，并且考虑到根据之前问题的答案你有50或100或1,000个问题的情况，这不是一个充分的解决方案。我只想展示你如何实现这一目标，并为将来的其他功能/更好的功能提供一个起点。

根据以前的复选框选择自动填充选择框

1 个答案: