在下拉菜单中禁用某些选项
[英]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.