jQuery选择多个属性并选中/取消选中另一个复选框

Question

我如何识别不同行中的以下复选框并单独检查/取消选中它们。

<input type="checkbox" value="F" name="eph-ds[2457][]"> 
<input type="checkbox" value="PR" name="eph-ds[2457][]"> 
<input type="checkbox" value="DPH" name="eph-ds[2457][]"> 
<input type="checkbox" value="F" name="eph-ds[2450][]"> 
<input type="checkbox" value="PR" name="eph-ds[2450][]"> 
<input type="checkbox" value="DPH" name="eph-ds[2450][]"> 

其中，[数量]是以二分方式创建的。

例如：如果选中“F”，取消选中“PR”。如果选择“PR”，取消选中“F”。如果选中“DPH”，则取消全部选中。

$(":checkbox").change(function() { 
    var current = this.value; 
    if (current == "F") { 
$(":checkbox[value=PR]").prop("checked", false); 
    } 
     if (current == "PR") { 
$(":checkbox[value=F]").prop("checked", false); 

    } 
    if (current == "DPH") { 
$(":checkbox[value=F]").prop("checked", false); 
$(":checkbox[value=PR]").prop("checked", false); 

    } 
}); 

此代码的工作，但如果我取消第二行中的复选框，然后复选框在第一行，将取消选中太：

Answer 1

这将执行您所请求的操作：

jsFiddle Working Example

var $this,num,val; 

$('input[name^="eph-ds["]').click(function() { 
    $this = $(this); 
    num = $this.attr('name').split('[')[1].replace("]", ""); 
    val = $this.val(); 
    if (val=="F"){ 
     $('input:checkbox[name="eph-ds['+num+'][]"][value="PR"]').prop('checked',false); 
    }else if (val=="PR"){ 
     $('input:checkbox[name="eph-ds['+num+'][]"][value="F"]').prop('checked',false); 
    }else if (val=="DPH"){ 
     $('input:checkbox[name="eph-ds['+num+'][]"]').not($this).prop('checked',false); 
    } 
}); 

注：在顶部声明

1. 变量因此T哎不必与每个复选框重新申报单击

2. 的jsfiddle增加了禁止F和PR时DPH检查（否则检查DPH盒用户后就可以再检查或者PR或F）。

3. 没有必要查询您的复选框的组（由以前的响应建议）

4. 如果难以遵循，这条线可以分为三条线：
   num = $this.attr('name').split('[')[1].replace("]", "");

name = $this.attr('name'); //returns eph-ds[####][]
temp = name.split('[')[1]; //returns ####]
num = temp.replace("]", ""); //removes trailing ]

Answer 2

的API示例使用引号来解决这个问题。

$("input[name='eph-ds[2457][]'][value='PR']").prop("checked", false); 

，并选择所有的人无论动态数量，使用attr^=value

$("input[name^='eph-ds['][value='PR']").prop("checked", false); 

http://api.jquery.com/attribute-starts-with-selector/

Answer 3

试试这个：

$("input[name=eph-ds[2457][]],input[value=PR]").prop("checked", false); 

Answer 4

像这样：

$('input[type="checkbox"]').prop('checked', false); 

Answer 5

你需要用的复选框，以便能够查询他们作为群体，我简化您的标记是：

<div class="row"> 
    <input type="checkbox" value="F" name="eph-ds[2457][]">F<br/> 
    <input type="checkbox" value="PR" name="eph-ds[2457][]">PR<br/> 
    <input type="checkbox" value="DPH" name="eph-ds[2457][]">DPH<br/> 
</div> 

<div class="row"> 
    <input type="checkbox" value="F" name="eph-ds[2450][]">F<br/> 
    <input type="checkbox" value="PR" name="eph-ds[2450][]">PR<br/> 
    <input type="checkbox" value="DPH" name="eph-ds[2450][]">DPH<br/> 
</div> 

你还可以加上你的标签，你有什么DOM元素为您造型和结构，但重要的是要有一个包装（在我的情况div.row）

现在使用下面的脚本：

<script> 
     $(document).ready(function(){ 
      $(":checkbox").change(function(){ 
       // get the wrapper so it won't affect the checkboxes in other rows 
       var _parent_row = $(this).closest(".row"); 
       // get the checkbox value 
       var _value = $(this).val(); 

       // uncheck PR if F is checked 
       if(_value == "F" && $(this).isChecked()) 
       { 
        var _pr = $(_parent_row).find(":checkbox[value='PR']"); 
        _pr.uncheck(); 
       } 

       // uncheck F if PR is checked 
       if(_value == "PR" && $(this).isChecked()) 
       { 
        var _f = $(_parent_row).find(":checkbox[value='F']"); 
        _f.uncheck(); 
       } 

       // uncheck All if DPH is checked 
       if(_value == "DPH" && $(this).isChecked()) 
       { 
        var _f = $(_parent_row).find(":checkbox[value='F']"); 
        var _pr = $(_parent_row).find(":checkbox[value='PR']"); 
        _f.uncheck(); 
        _pr.uncheck(); 
       } 
      }) 
     }) 

     // prototype function to test if a checkbox is checked 
     $.fn.isChecked = function(){ 
      return $(this).is(':checked'); 
     }; 

     // prototype function to check a textbox 
     $.fn.check = function(){ 
      $(this).attr('checked', true); 
     }; 

     // prototype function to uncheck a textbox 
     $.fn.uncheck = function(){ 
      $(this).attr('checked', false); 
     }; 
    </script> 

这应该这样做:) 您仍然可以在文档中的任何其他复选框上使用.isChecked（），.check（）和.uncheck（）（因此您不必重复自己）

Answer 6

检查这个JSFiddle Example

HTML代码

<div class="row"> 
    <input type="checkbox" value="F" name="eph-ds[2457][]">F<br/> 
    <input type="checkbox" value="PR" name="eph-ds[2457][]">PR<br/> 
    <input type="checkbox" class="clear" value="DPH" name="eph-ds[2457][]">DPH<br/> 
</div> 

<div class="row"> 
    <input type="checkbox" value="F" name="eph-ds[2450][]">F<br/> 
    <input type="checkbox" value="PR" name="eph-ds[2450][]">PR<br/> 
    <input type="checkbox" class="clear" value="DPH" name="eph-ds[2450][]">DPH<br/> 
</div> 

JQuery的代码

$(document).ready(function(){ 

    $('.row .clear').change(function(){ 
     clearFunction($(this).parent('.row')); 
     $(this).prop("checked",false); 
    }); 


    $('.row input:checkbox').change(function(){ 
     $(this).siblings('input').prop("checked", false); 
    }); 
}); 
    function clearFunction(localEl){ 
     localEl.children('input:checkbox').each(
      function(){ 
       if($(this).prop('checked')){ 
        $(this).removeAttr('checked'); 
       } 
      } 
     ); 
    } 

Answer 7

这样做是在10分钟内

please check it out my minimalist approch

<div> 
<input type='checkbox' class='mEx cBox' name='F' title='F'/> 
<input type='checkbox' class='mEx cBox' name='PR' title='PR'/> 
<input type='checkbox' class='Ex cBox' name='DPH' title='DPH'/> 
</div> 

$('.cBox').change(function(){ 
    var current = $(this); 
    var parentCntr = current.parent(); 
    var isChecked = current.is(':checked'); 
    if(isChecked) {   
     if(current.hasClass('Ex')) { 
      $('.mEx',parentCntr).attr({checked:false,disabled:true}); 
     }else if(current.hasClass('mEx')) { 
      $('.mEx',parentCntr).attr({checked:false}); 
      current.attr({checked:true}); 
     }  
    }else{ 
     if(current.hasClass('Ex')) { 
      $('.mEx',parentCntr).attr({disabled:false}); 
     } 
    } 
}); 

我认为chekboxes的要求的行为有什么用thier值做