0

最初の選択ボックスから修士号オプションを選択すると、2番目の選択ボックスにはMBA/財務およびMBA/マーケティングオプションのみが表示され、3番目の選択ボックスからは学士号、修士号、および博士号が表示されます。ここで、最初の選択ボックスから学士号オプションを選択すると、2番目の選択ボックスにはBCJ/法執行とBCJ/修正オプションのみが表示され、3番目の選択ボックスからはすべてのオプションが表示されます。私はいくつかのコードを実行しましたが、機能していません。

<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 に答える