jQuery – 禁用所选的选项

前端之家收集整理的这篇文章主要介绍了jQuery – 禁用所选的选项前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
需要使用jQuery在选择框中禁用已选择的选项。我想它像 asmselect灰色。

测试我的例子here

//JS
$("#theSelect").change(function(){          
  var value = $("#theSelect option:selected").val();
  var theDiv = $(".is" + value);

  theDiv.slideDown().removeClass("hidden");
});


$("div a.remove").click(function () {     
  $(this).parent().slideUp(function() { $(this).addClass("hidden"); }); 
});

//HTML
<body>
<div class="selectContainer">
    <select id="theSelect">
        <option value="">- Select -</option>
        <option value="Patient">Patient</option>
        <option value="Physician">Physician</option>
        <option value="Nurse">Nurse</option>
    </select>
</div>
<div class="hidden isPatient">Patient <a href="#" class="remove" rel="Patient">remove</a></div>
<div class="hidden isPhysician">Physician <a href="#" class="remove" rel="Patient">remove</a></div>
<div class="hidden isNurse">Nurse <a href="#" class="remove" rel="Patient">remove</a></div>
</body>​

UPDATED:这是finished solution.感谢Patrick和Simen。

解决方法

将此行添加到您的更改事件处理程序
$("#theSelect option:selected").attr('disabled','disabled')
        .siblings().removeAttr('disabled');

这将禁用所选选项,并启用任何先前禁用的选项。

编辑:

如果你不想重新启用以前的,只需删除这部分行:

.siblings().removeAttr('disabled');

编辑:

http://jsfiddle.net/pd5Nk/1/

要在点击删除时重新启用,请将其添加到您的点击处理程序。

$("#theSelect option[value=" + value + "]").removeAttr('disabled');

猜你在找的jQuery相关文章