jQuery – 禁用选定的选项
需要使用jQuery在select框中禁用已经select的选项。 我希望它像asmselect灰色。
在这里testing我的例子。
//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> 更新 ：这是完成的解决scheme 。 感谢Patrick和Simen。
将此行添加到您的change事件处理程序
$("#theSelect option:selected").attr('disabled','disabled') .siblings().removeAttr('disabled');
这将禁用选定的选项，并启用任何以前禁用的选项。
编辑：
如果你不想重新启用以前的那个，只要删除这一行的这一部分：
.siblings().removeAttr('disabled');
编辑：
点击删除后重新启用，将其添加到您的点击处理程序。
$("#theSelect option[value=" + value + "]").removeAttr('disabled');
这将分别在select/删除选项时禁用/启用选项。
$("#theSelect").change(function(){ var value = $(this).val(); if (value === '') return; var theDiv = $(".is" + value); var option = $("option[value='" + value + "']", this); option.attr("disabled","disabled"); theDiv.slideDown().removeClass("hidden"); theDiv.find('a').data("option",option); }); $("div a.remove").click(function () { $(this).parent().slideUp(function() { $(this).addClass("hidden"); }); $(this).data("option").removeAttr('disabled'); });
演示： http : //jsfiddle.net/AaXkd/
这似乎工作：
$("#theSelect").change(function(){ var value = $("#theSelect option:selected").val(); var theDiv = $(".is" + value); theDiv.slideDown().removeClass("hidden"); //Add this... $("#theSelect option:selected").attr('disabled', 'disabled'); }); $("div a.remove").click(function () { $(this).parent().slideUp(function() { $(this).addClass("hidden"); }); //...and this. $("#theSelect option:disabled").removeAttr('disabled'); });
请试试这个，
$('#select_id option[value="'+value+'"]').attr("disabled", true);
