如何禁用<选项>在< select>基于它在JavaScript中的价值? [英] How can I disable an <option> in a <select> based on its value in JavaScript?
问题描述
我有一个< select>
,其中一些< option>
s。每个都有独特的价值。我需要使用给定的定义值(不是innerhtml)来禁用< option>
。 任何人都有想法如何?
纯Javascript
必须单独检查每个选项的值。
// //获取< select中的所有选项ID = '富' > ...< /选择>
var op = document.getElementById(foo)。getElementsByTagName(option);
for(var i = 0; i //小写字母不区分大小写比较
(op [i] .value.toLowerCase()== stackoverflow)
? op [i] .disabled = true
:op [i] .disabled = false;
}
不启用非目标元素:
//获取< select id ='foo'> ...中的所有选项...< / select>
var op = document.getElementById(foo)。getElementsByTagName(option);
for(var i = 0; i //小写字母不区分大小写比较
if(op [i] .value.toLowerCase()= =stackoverflow){
op [i] .disabled = true;
code $
$ h $ j $
使用jQuery,您可以使用一行代码完成此操作:
$(option [value ='stackoverflow' ])
.attr(disabled,disabled)
.siblings()。removeAttr(disabled);
不启用非目标元素:
$(option [value ='stackoverflow'])。attr(disabled,disabled);
请注意,这个不是大小写不敏感的。 StackOverflow不会等于stackoverflow。要获得不区分大小写的匹配,您必须循环遍历每个值,将值转换为小写,然后检查:
< $(this).val()。toLowerCase()==stackoverflow){
$(this())$($) ).attr(disabled,disabled)。siblings()。removeAttr(disabled);
}
});
不启用非目标元素:
<$ ($(this).val()。toLowerCase()==stackoverflow){$ b($ {code> $(option)。 $ b $(this).attr(disabled,disabled);
}
});
I have a <select>
with a number of <option>
s. Each has a unique value. I need to disable an <option>
with a given defined value (not innerhtml).
Anyone have an idea how?
Pure Javascript
With pure Javascript, you'd have to cycle through each option, and check the value of it individually.
// Get all options within <select id='foo'>...</select>
var op = document.getElementById("foo").getElementsByTagName("option");
for (var i = 0; i < op.length; i++) {
// lowercase comparison for case-insensitivity
(op[i].value.toLowerCase() == "stackoverflow")
? op[i].disabled = true
: op[i].disabled = false ;
}
Without enabling non-targeted elements:
// Get all options within <select id='foo'>...</select>
var op = document.getElementById("foo").getElementsByTagName("option");
for (var i = 0; i < op.length; i++) {
// lowercase comparison for case-insensitivity
if (op[i].value.toLowerCase() == "stackoverflow") {
op[i].disabled = true;
}
}
jQuery
With jQuery you can do this with a single line:
$("option[value='stackoverflow']")
.attr("disabled", "disabled")
.siblings().removeAttr("disabled");
Without enabling non-targeted elements:
$("option[value='stackoverflow']").attr("disabled", "disabled");
Note that this is not case insensitive. "StackOverflow" will not equal "stackoverflow". To get a case-insensitive match, you'd have to cycle through each, converting the value to a lower case, and then check against that:
$("option").each(function(){
if ($(this).val().toLowerCase() == "stackoverflow") {
$(this).attr("disabled", "disabled").siblings().removeAttr("disabled");
}
});
Without enabling non-targeted elements:
$("option").each(function(){
if ($(this).val().toLowerCase() == "stackoverflow") {
$(this).attr("disabled", "disabled");
}
});
这篇关于如何禁用<选项>在< select>基于它在JavaScript中的价值?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!