0

如果我从第一个选择框中选择硕士学位选项，那么在第二个选择框中它将仅显示 MBA/金融和 MBA/市场营销选项，从第三个选择框中它将显示学士学位、硕士学位和博士学位。现在，如果我从第一个选择框中选择学士学位选项，那么在第二个选择框中它将仅显示 BCJ/Law Enforcement 和 BCJ/Corrections 选项，从第三个选择框中它将显示所有选项。我做了一些代码，但它不起作用。

<select id="degree">
<option value="default">Choose a degree</option>
<option value="Master">Master Degree</option>
<option value="Bachelor">Bachelor Degree</option>


<select id="program">
<option value="default">Choose  a program</option>
<option value="MBA/FN" Degree="Master">MBA/Finance</option>
<option value="MBA/MK" Degree="Master">MBA/Marketing</option>
<option value="BCJ/LE" Degree="Bachelor">BCJ/Law Enforcement</option>
    <option value="BCJ/COR" Degree="Bachelor">BCJ/Corrections</option>


<select id="level">
<option selected="selected" value="">Choose Highest level of Education</option>
    <option value="Less than 2 years of college">Less than 2 years of college</option>
    <option value="2 or more years of college">2 or more years of college</option>
    <option value="Associate Degree">Associate Degree</option>
    <option value="Bachelor Degree">Bachelor Degree</option>
    <option value="Master Degree">Master Degree</option>
    <option value="Doctorate Degree">Doctorate Degree</option>

4

1 回答 1

0

HTML

根据您的选择框...

   <select id="degree">
<option value="default">Choose a degree</option>
<option value="Master">Master Degree</option>
<option value="Bachelor">Bachelor Degree</option>

<select id="program">
<option value="default">Choose  a program</option>

<optgroup class="level1">
<option class="level1" value="MBA/FN" Degree="Master">MBA/Finance</option>
<option class="level1" value="MBA/MK" Degree="Master">MBA/Marketing</option>
</optgroup>
<optgroup class="level2">
<option class="level2" value="BCJ/LE" Degree="Bachelor">BCJ/Law Enforcement</option>
<option class="level2" value="BCJ/COR" Degree="Bachelor">BCJ/Corrections</option>
</optgroup>
<select id="level">

<option selected="selected" value="">Choose Highest level of Education</option>
    <optgroup class="level3">
    <option class="level3" value="Less than 2 years of college">Less than 2 years of college</option>
    <option class="level3" value="2 or more years of college">2 or more years of college</option>
    </optgroup>
    <optgroup class="level1">
    <option class="level1" value="Associate Degree">Associate Degree</option>
    <option class="level1" value="Bachelor Degree">Bachelor Degree</option>
    </optgroup>
    <optgroup class="level2">
    <option class="level2" value="Master Degree">Master Degree</option>
    <option class="level2" value="Doctorate Degree">Doctorate Degree</option>
    </optgroup>

脚本

   $('#degree').change(function () {
        if ($('#degree option:selected').text() == "Master"){
                $('.level1').css('display', 'block');
                $('.level2').css('display', 'none');
                $('.level3').css('display', 'none');
        } else if ($('#degree option:selected').text() == "Bachelor"){
                $('.level1').css('display', 'none');
                $('.level2').css('display', 'block');
                $('.level3').css('display', 'none');
        }  else {
                $('.level1').css('display', 'block');
                $('.level2').css('display', 'block');
                $('.level3').css('display', 'block');
        }});
于 2013-03-02T11:57:43.740 回答