动态更改下拉选项与其他下拉选择

我相对较新的PHP，特别是它的jQuery方面。我想要做的是让用户在一个下拉框中选择影响另一个框的选项。动态更改下拉选项与其他下拉选择

第一个下拉（输入而改变第二）

<select class="form-control" id="form" name="form" required> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
<option value="4">4</option> 
<option value="5">5</option> 
<option value="6">6</option> 
<option value="7">7</option> 
</select>

第二个下拉（选项的改变取决于输入的第一下拉）

<select class="form-control" id="subject" name="subject" required> 
<option value="English">English</option> 
<option value="Maths">Maths</option> 
<option value="Science">Science</option> 
<option value="Geography">Geography</option> 
<option value="History">History</option> 
<option value="RS">RS</option> 
<option value="BSEC">BSEC</option> 
<option value="French">French</option> 
<option value="German">German</option> 
<option value="Spanish">Spanish</option> 
<option value="Italian">Italian</option> 
<option value="Latin">Latin</option> 
<option value="Greek">Greek</option> 
<option value="Art">Art</option> 
<option value="3D Design">3D Design</option> 
<option value="Drama">Drama</option> 
<option value="Music">Music</option> 
<option value="PE">PE</option> 
</select>

理想情况下，只从英国选项如果选择的数字从1到5出现，希腊文将显示，但如果选择6或7，则只显示从艺术到PE的选项。我被告知这可以在JavaScript或jQuery中完成，但jQuery会更快。请你能为我提供一个解决方案，如果可能的话可以做到这一点。

来源

2014-04-01 mattleeuk

可能重复的[JQuery的依赖下拉框填充 - 如何]（http://stackoverflow.com/questions/5910281/jquery-dependent-drop-down-boxes-populate-how） –

此代码将为您完成作业。它不是一个干净的代码，我相信有一些更好的方法来做到这一点，但是这是一个很简单的方法：

$("#form").change(function() { 
    if (parseInt($(this).val()) < 6) { 
     $("#subject").html('        \ 
      <option value="English">English</option>  \ 
      <option value="Maths">Maths</option>   \ 
      <option value="Science">Science</option>  \ 
      <option value="Geography">Geography</option> \ 
      <option value="History">History</option>  \ 
      <option value="RS">RS</option>     \ 
      <option value="BSEC">BSEC</option>    \ 
      <option value="French">French</option>   \ 
      <option value="German">German</option>   \ 
      <option value="Spanish">Spanish</option>  \ 
      <option value="Italian">Italian</option>  \ 
      <option value="Latin">Latin</option>   \ 
      <option value="Greek">Greek</option>   \ 
      '); 
    } else { 
     $("#subject").html('         \ 
      <option value="Art">Art</option>     \ 
      <option value="3D Design">3D Design</option>  \ 
      <option value="Drama">Drama</option>    \ 
      <option value="Music">Music</option>    \ 
      <option value="PE">PE</option>     \ 
      '); 
    } 
});

的jQuery无关与PHP的方式。 Jquery是一个JavaScript库，它运行在客户端，而PHP运行在服务器端。

来源

2014-04-01 22:12:05

动态更改下拉选项与其他下拉选择

回答

相关问题