jQuery的复选框目标ID唯一的一个

Question

$(document).ready(function(){ 
$(function(){ 
    $('input:checkbox').prop('checked', false) 
    $('input:checkbox').click(function(){ 
     if($(this).is(':checked')){ 
      $('input:checkbox').not(this).prop('checked', false);   
     } 
    }); 
}) 
showdiv(); 

}); 

---

上面的代码工作真棒！首先它使所有复选框“未选中”，然后它使得它一次只能检查“一个”复选框！

但是...我也需要它，只影响下面的三个复选框！并非所有的页面上的复选框！猜猜我不知道如何使其目标只是编号的co33，co34，co35 ..

<input name="option[13]" id="co33" value="33" checked="checked" onclick="showdiv()" type="radio"> 
<input name="option[14]" id="co34" value="34" checked="checked" onclick="showdiv()" type="radio"> 
<input name="option[15]" id="co35" value="35" checked="checked" onclick="showdiv()" type="radio"> 

然后!!! ...如果其中一个被选中，那么这个第四个复选框也会被检查！如果上面三个中的任何一个都被选中，那么这个选项也不会被检查！

<input id="a1" type="checkbox" onclick="showdiv()" name="add[1]"> 

男子我希望出来的权利..的HTML被自动创建，所以我不能让他们所有具有相同的ID或添加类，以便即时寻找，看看我是否可以通过ID名称瞄准他们..坦白地说，即使只是能够将代码初始发布以实现3个复选框，也是非常棒的。如果选中三个复选框中的一个，就可以检查第四个复选框是否是奖励！

Answer 1

你可以通过名称使用属性选择器来定位它们，它不是非常高效，但它会工作，可能工作得很好。只要改变你的所有$('input:checkbox') s到：

$('input[name="option[13]"], input[name="option[14]"], input[name="option[15]"]') 

，并在单击处理程序结束（外部IF），这样做：

$('#a1').prop(
    "checked", 
    $('input[name="option[13]"], input[name="option[14]"], input[name="option[15]"]') 
     .is(':checked') 
); 

编辑：其实，我只注意到该组的ID的兴趣，它会更快（并减少打字）击中这些。使用选择：

$('#co33, #co34, #co35') 

Answer 2

你的问题是像

“但是......我需要它太影响只以下三个复选框在页面上并不是所有的复选框！猜猜我不知道如何使目标仅仅是ID的co33，co34，co35。”

<input name="option[13]" id="co33" value="33" checked="checked" onclick="showdiv()" type="radio"> 
<input name="option[14]" id="co34" value="34" checked="checked" onclick="showdiv()" type="radio"> 
<input name="option[15]" id="co35" value="35" checked="checked" onclick="showdiv()" type="radio"> 

，你现在有上面的HTML标记为HTML定义他们的无线没有checkbox。

所以尽量

$('input:radio').attr('checked', false) 
$('input:radio').click(function(){ 
    if($(this).is(':checked')){ 
     $('input:radio').not(this).attr('checked', false);   
    } 
}); 

Answer 3

你无线电混合了复选框。您还在DOM准备好的事件中包装了DOM准备好的事件。在这里你去：

$(function(){ 
    $('input:checkbox').prop('checked', false); 
    $('input:radio').prop('checked', false).filter(function(e){ 
     return (this.id == 'co33' || 
       this.id == 'co34' || 
       this.id == 'co35'); 
    }).on('click', function(){ 
     if($(this).is(':checked')){ 
      $('input:radio').not(this).prop('checked', false); 
      $('#a1').prop('checked', true); 
     }   
    }); 
    showdiv(); 
}); 

演示：http://jsfiddle.net/qUtQb/

Answer 4

试着这么做

$(function(){ 
    var radios = $('input:radio[name^=option]').prop('checked', false) 
    radios.click(function(){ 
     if($(this).is(':checked')){ 
      $('input:radio[name^=option]').not(this).prop('checked', false);   
     } 

     $('#a1').prop('checked', radios.is(':checked')) 
    }); 

    showdiv(); 
}); 

演示：Fiddle