Question

伙计们我使用以下代码来禁用使用jQuery的选项（ jquery-1.4.2.min ）。禁用发生在Firefox中，但不在IE中。

<SELECT NAME="SCOPE" id="SCOPE">  
 <OPTION VALUE="G"> Global
 <OPTION VALUE="D"> Dynamic  
</SELECT>


 $("#SCOPE option[value='G']").attr("disabled","disabled");
 $("#SCOPE option[value='D']").attr("selected", "selected");

Answer 1

我想我可能错了，但可能是因为可以禁用选择而不是选项。因为firefox很棒而IE很糟糕，所以你可以猜到为什么:)你有这个问题。使用css将该选项的文本变灰。

然后在jquery上做这样的事情。

$('#SCOPE').change(function(){
  if($('#SCOPE option[value="'+$(this).val()+'"]').attr('disabled') == 'disabled'){
    alert('Its disabled you cannot select this option');
  }
});

顺便说一句。仔细检查代码，因为我没有测试过这个：）

Answer 2

我的观点与其他答案略有不同。

目的不是隐藏选项，而是让它们禁用（以保持UI一致）。

我的情景：

我在表单中有多个选项，当用户在其中一个选项中选择一个选项时，其他选项应禁用此选项，反之亦然。限制用户选择已选择的相同选项。我们通常禁用该选项，但对于不支持它的IE 7。用户还可以选择添加新选项。

解决方案：

载入时：

如果浏览器是IE7，那么在填充选择并禁用其他选项上已选择的选项时，我正在为选项添加自定义属性（“data-ie7-disabled”）并且还更改禁用选项的颜色到'#cccccc'（这是禁用选项的标准颜色）。这使得UI在浏览器中看起来相同。

On Change：

我将上一个选项保存在局部变量中（这在焦点上保存）。

当用户尝试更改选项时

用户选择一个未在任何其他下拉列表中选择的完整新选项。然后我遍历其他选择并更改颜色，并在其他选择中将自定义属性添加到此选定选项。

当用户选择已选择的选项时（灰色显示的选项）。我首先检查该选项是否具有此自定义属性。如果它具有那么>我只是将选项恢复为上一个选项，并显示错误消息“此选项已被选中或BLAH BLAH”。

当用户将其现有选项更改为未在任何其他下拉列表中选择的全新选项时。我再次遍历所有其他选择选项并删除它上面的颜色以及自定义属性。

希望这有帮助。

下拉列表中的Jquery禁用选项

2 个答案: