jQuery-禁用选定的选项 [英] jQuery - disable selected options

查看:69
本文介绍了jQuery-禁用选定的选项的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

需要使用jQuery在选择框中禁用已选择的选项.我希望它像 asmselect 一样变灰.

Need to disable already selected options in select box using jQuery. I'd like it to grey out like asmselect.

此处进行测试.

//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>​

已更新:这是完成的解决方案.感谢Patrick和Simen.

UPDATED: Here's the finished solution. Thanks to Patrick and Simen.

推荐答案

将此行添加到您的change事件处理程序

Add this line to your change event handler

    $("#theSelect option:selected").attr('disabled','disabled')
        .siblings().removeAttr('disabled');

这将禁用选定的选项,并启用所有以前禁用的选项.

This will disable the selected option, and enable any previously disabled options.

如果您不想重新启用以前的版本,只需删除该行的这一部分:

If you did not want to re-enable the previous ones, just remove this part of the line:

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


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

要在单击删除"时重新启用,请将其添加到点击处理程序中.

To re-enable when you click remove, add this to your click handler.

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

这篇关于jQuery-禁用选定的选项的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆