我希望當我從下拉串列 1 中選擇一個值時,它會更改下拉串列 2 中的選項
例如:如果我從“下拉選單 1”中選擇“植物 2 或植物 3”,那么在“下拉選單 2”中它應該會自動更改為“其他選項”。只有 2 個下拉選單
任何人都可以幫我嗎?我提前謝謝你!
這是我的演示
[演示][1]
<select name="" id="">
<option value="">Select</option>
<option value="">plant 1</option>
<option value="">plant 2</option>
<option value="">plant 3</option>
</select>
<select name="" id="">
<option value="">Select</option>
<option value="">outside 1</option>
<option value="">inside 1</option>
</select>
//other option is
//outside 2/3
//inside 2/3
[1]: https://jsfiddle.net/Tafreets/68k2pvg3/
uj5u.com熱心網友回復:
我可以想到兩個選擇。第一個選項是在第一個下拉串列中使用更改事件,然后讀取所選值,清空第二個下拉串列,然后使用 if/else 或 switch 陳述句將選項添加到第二個下拉串列:Demo
$('#plantType').on('change', function() {
var actionDrop = $("#location");
actionDrop.empty();
switch(this.value) {
case 'plant1':
actionDrop.append($('<option>', {value:'outside1', text:'outside 1'}));
actionDrop.append($('<option>', {value:'inside1', text:'inside 1'}));
break;
case 'plant2':
actionDrop.append($('<option>', {value:'outside2', text:'outside 2'}));
actionDrop.append($('<option>', {value:'inside2', text:'inside 2'}));
break;
}
});
第二個選項有單獨的下拉元素。當用戶從第一個下拉串列中選擇時,然后根據使用 javascript 或 Jquery 的選擇顯示和隱藏相關下拉串列:演示
$('#plantType').on('change', function() {
$('.location').hide();
if (this.value==="plant1"){
$('#plant1Location').show()
}else if(this.value==="plant2"){
$('#plant2Location').show()
}
});
轉載請註明出處,本文鏈接:https://www.uj5u.com/gongcheng/518645.html
下一篇:當跨度內的數字大于0時添加類
