我有这个,
<select id="rid" style="border: 1px solid #ccc;" name="rid">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
<option value="4">Option 4</option>
<option value="5">Option 5</option>
<option value="6">Option 6</option>
</select>
我有这个触发事件的链接,
<a href="#">Disable Option 1</a><br />
<a href="#">Disable Option 2</a><br />
<a href="#">Disable Option 3</a>
现在,如果点击Disable Option 1
,则会从选择下拉列表中停用Option 1
。我在想,通过使用属性value
,我可以指定哪个选项可以禁用我将点击的链接,但我迷路了。如何仅使用value
属性禁用下拉列表中的任何选项?
答案 0 :(得分:9)
修改强>
例如,当单击禁用选项1时,它将禁用选项1,4和5,当我单击禁用选项2时,它将禁用选项2和3,有点像。
设置如下所示的链接
<a href="#" data-val="1,4,5">Disable Option 1</a><br />
<a href="#" data-val="2,3">Disable Option 2</a><br />
<a href="#" data-val="3">Disable Option 3</a>
并更改如下代码,
$('a').click (function () {
var thisVal = $(this).data('val')+'';
$('#rid option').filter(function () {
return $.inArray(this.value, thisVal.split(',')) >= 0;
}).prop('disabled', true);
});
DEMO: http://jsfiddle.net/vPhJc/1/
如果您设置如下链接,
<a href="#" data-val="1">Disable Option 1</a><br />
<a href="#" data-val="2">Disable Option 2</a><br />
<a href="#" data-val="3">Disable Option 3</a>
然后你可以
$('a').click (function () {
$('#rid option[value=' + $(this).data('val') + ']').prop('disabled', true);
});
答案 1 :(得分:2)
请检查
<强> HTML:强>
<a href="#">Disable Option <span>1</span></a><br />
<a href="#">Disable Option <span>2</span></a><br />
<a href="#">Disable Option <span>3</span></a>
<强>代码:强>
$("a").click(function(){
// if you want to enable previously disabled option then do this
// $("#rid").find("option").removeAttr('disabled');
$("#rid").find("option[value='"+$(this).find("span").html()+"']")
.attr('disabled','disabled');
});
答案 2 :(得分:1)
JQuery支持可以检查[name="value"]
等属性值的选择器。
答案 3 :(得分:0)
为什么不给每个链接一个id,然后使用id值
禁用选择框中的选项