Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/wcf/4.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 使用其他下拉选择动态更改下拉选项_Javascript_Php_Jquery_Forms - Fatal编程技术网

Javascript 使用其他下拉选择动态更改下拉选项

Javascript 使用其他下拉选择动态更改下拉选项,javascript,php,jquery,forms,Javascript,Php,Jquery,Forms,我对php比较陌生,尤其是它的jquery方面。我想做的是让用户在一个下拉框上的选择影响另一个框的选项 第一个下拉列表(第二个更改的输入) 1. 2. 3. 4. 5. 6. 7. 第二个下拉列表(选项根据第一个下拉列表中的输入而变化) 英语 数学 科学类 地理 历史 RS 黑海经合组织 法语 德国的 西班牙的 意大利人 拉丁语 希腊人 艺术 三维设计 戏剧 音乐 体育课 理想情况下,如果选择的数字为1到5,则只显示从英语到希腊语的选项,但如果选择了6或7,则只显示从艺术到体育的选项。我

我对php比较陌生,尤其是它的jquery方面。我想做的是让用户在一个下拉框上的选择影响另一个框的选项

第一个下拉列表(第二个更改的输入)


1.
2.
3.
4.
5.
6.
7.
第二个下拉列表(选项根据第一个下拉列表中的输入而变化)


英语
数学
科学类
地理
历史
RS
黑海经合组织
法语
德国的
西班牙的
意大利人
拉丁语
希腊人
艺术
三维设计
戏剧
音乐
体育课

理想情况下,如果选择的数字为1到5,则只显示从英语到希腊语的选项,但如果选择了6或7,则只显示从艺术到体育的选项。我被告知这可以用javascript或jquery完成,但jquery会更快。如果可能的话,请您为我提供一个解决方案。

此代码将为您完成这项工作。这不是一个干净的代码,我相信有一些更好的方法可以做到这一点,但这是一个非常简单的方法:

$("#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>                   \
            ');
    }
});
$(“#表单”).change(函数(){
if(parseInt($(this).val())<6){
$(“#主题”).html('\
英式\
数学\
科学\
地理\
历史\
RS\
黑海经合组织\
法语的\
德文\
西班牙文\
意大利人\
拉丁语\
希腊语\
');
}否则{
$(“#主题”).html('\
艺术\
三维设计\
戏剧\
音乐\
体育\
');
}
});
顺便说一下,Jquery与PHP无关。Jquery是一个javascript库,它在客户端运行,而PHP在服务器端运行。

可能重复
<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>
$("#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>                   \
            ');
    }
});