根据其值和所选选项禁用/启用复选框

我需要对启用/禁用的复选框的值进行硬编码，具体取决于所选的选项值。 我试图做这样的事情：

$("#Units").on("change", function () { if ($(this).val() !== "Finance") { $(".dissable").val("3").prop("disabled", true); $(".dissable").val("4").prop("disabled", true); } else { $(".dissable").val("3").prop("disabled", false); $(".dissable").val("4").prop("disabled", false); } }).trigger('change'); 

    Marketing   Finance   Operations    chbx1  chbx2  chbx3  chbx4 

但没有预期的效果，应该是这样的：

• 当我选择其他选项时，“财务”，复选框号。 3和4被禁用。
• 对于“财务”，将启用所有复选框。

我需要根据复选框值执行此操作，而不仅仅是类。

Answer 1

使用以下选择器：

 $(".dissable[value='3']").prop("disabled", true); 

[value='3']根据值创建选择。 见工作示例：

 $("#Units").on("change", function () { if ($(this).val() !== "Finance") { $(".dissable[value='3']").prop("disabled", true); $(".dissable[value='4']").prop("disabled", true); } else { $(".dissable[value='3']").prop("disabled", false); $(".dissable[value='4']").prop("disabled", false); } }).trigger('change'); 

    Marketing   Finance   Operations    chbx1  chbx2  chbx3  chbx4 

Answer 2

您需要根据值过滤复选框，因此请使用$.fn.filter 。 目前，您使用$(".dissable").val("3")设置其值$(".dissable").val("3")

将匹配元素集减少到与选择器匹配的元素或传递函数的测试。

码

 $("#Units").on("change", function () { //Filter checkboxes whose value is 3 or 4 $(".dissable").filter(function(){ return $(this).val() == 3 || $(this).val() == 4; }).prop("disabled", $(this).val() == "Finance"); //disable or enable based on condition }).trigger('change'); 

DEMO

Answer 3

尝试缓存$(".dissable") ，在缓存选择器上使用.slice()

 function check() {} var disable = $(".dissable"); $("#Units").on("change", function() { if ($(this).val() !== "Finance") { // disable `.dissable` at index `2,` `3` disable.slice(2, 4).prop("disabled", true); } else { // enable `.dissable` at index `2,` `3` disable.slice(2, 4).prop("disabled", false); } }).trigger("change"); 

   Marketing Finance Operations  chbx1 chbx2 chbx3 chbx4