2

別のドロップダウンで選択されたオプションに応じて、ある選択ドロップダウンでオプションを表示/非表示にする必要があります。

つまり、「その他」を選択すると、葯のドロップダウンの完全なリスト（男性と女性）に表示されます!! 「mr.engine」を選択すると「Male」のみが表示され、「miss.engine」を選択すると「female」のみが表示されます。

<select>
<option value="">Choose</option>
<option value="Mr">Mr. Engineer</option>
<option value="Miss">Miss. Engineer</option>
<option value="other">Other</option>

</select>

<select>
<!--Below shows when 'Other' is selected , and show otherwise-->
<option value="0">choose</option>

<!--Below shows when 'Mr. engineer' is selected jsut , and hidden otherwise-->
<option value="male">Male</option>

<!--Below shows when 'Miss. engineer' is selected just, and hidden otherwise-->
<option value="female">Female</option>

</select>
4

2 に答える 2

0

あなたは使用changeして行うことができます：

$("#dropdownlist").change(function() {
   var control = $(this);

   if (control.val() == "Engineer") {
      $("#dropdownlist2").show();
   }
});

これは、次の構造に基づいています。

<select id="dropdown1">
   <option value="Mechanic">Mechanic </option>
   <option value="Engineer">Engineer</option>
 </select>

<select id="dropdown2" style="display:none">
   <option value="Item 1">Item 1 </option>
   <option value="Item 2">Item 2 </option>
 </select>

http://jsfiddle.net/zs3QG/

于 2013-03-16T12:45:15.090 に答える
0

このような状況では、私は通常、HTML 自体の選択の間で値をマッピングし、JS に配線するのではなく、JS からそれらのマッピングを使用することに頼っています。

例:appliesto属性は、select1 の各オプションに適用可能な select2 のオプションをマップします。

<select id="one">
  <option>Choose</option>
  <option appliesto="male">Mr. Engineer</option>
  <option appliesto="female">Miss. Engineer</option>
  <option appliesto="other">Other</option>
</select>

<select id="two">
  <option type="other">choose</option>
  <option type="male">Male</option>
  <option type="female">Female</option>
</select>

これらのマッピングを使用して、必要に応じて JS を介して表示/非表示を切り替えます。

$('select#one').change(function() {
    var selType = $(this).find('option:selected').attr('appliesto');
    $('select#two option[type="'+selType+'"]').prop('selected', true);
});

このデモを確認してください: http://jsfiddle.net/xGJRP/1/

もちろん、これをさらに微調整する必要があるかもしれませんが、アイデアは理解できると思います。

于 2013-03-16T12:53:17.910 に答える