在下拉菜單中禁用某些選項
[英]Disable certain options in a drop down select
問題描述
選擇選項值“ 2”時，需要禁用選項“ 5”和“ 6”。 選擇選項“ 1”時，它應顯示List_2中的所有選項。 我該如何使用jQuery或其他任何方法。
if ($('option[value=2]').prop('selected', true)) { $('option[value=5]').prop('disabled', true); }
<HTML> <body> <select id= "List_1"> <option value="1">Option 1</option> <option value="2">Option 2</option> </select> <select id= "List_2"> <option value="4">Option 4</option> <option value="5">Option 5</option> <option value="6">Option 6</option> </select> </body> </HTML>
2 個解決方案
解決方案1
2 2017-09-11 05:04:35
在這里，您可以找到一個解決方案https://jsfiddle.net/eurbvzk1/
var disabledDic = { "1" : ["6"], "2" : ["4", "5"], "3" : [] } $('select#list_1').on('change', function(){ $('select#list_2 option').each(function(){ $(this).removeAttr('disabled'); }); var disableOption = disabledDic[$(this).val()]; $.each( disableOption, function(i){ $('option[value="' + disableOption[i] + '"]').prop('disabled', 'disabled'); }); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <select id="list_1"> <option value="1">Option 1</option> <option value="2">Option 2</option> <option value="3">Option 2</option> </select> <select id= "list_2"> <option value="4">Option 4</option> <option value="5">Option 5</option> <option value="6">Option 6</option> </select>
創建一個包含每個第一個選擇選項的字典，因為鍵和值將是第二個列表中禁用選項的列表。
Onchange方法檢查字典並遍歷禁用值。
希望這會幫助你。
解決方案2
1 已采納 2017-09-11 04:01:50
使用普通的JS：
document.getElementById('List_1').onchange = function() { document.getElementById('List_2')[1].disabled = (document.getElementById('List_1').selectedIndex == 1); document.getElementById('List_2')[2].disabled = (document.getElementById('List_1').selectedIndex == 1); }
<select id="List_1"> <option value="1">Option 1</option> <option value="2">Option 2</option> </select> <select id="List_2"> <option value="4">Option 4</option> <option value="5">Option 5</option> <option value="6">Option 6</option> </select>
如何在下拉列表中禁用某些選項？
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.