1

我正在努力完成这项工作,但无法实现。我有一个引导模板,我想选中和取消选中多个复选框(例如:http: //jsfiddle.net/v6wmV/177/)我知道这是一个常见的主题,有很多解决方案,但似乎没有一个适用于这种情况我想知道为什么。

这是视图中的代码片段:

<div class="hide" id="states">
<div class="control-group">
<label class="control-label">Select</label>
    <div class="check">
    <div class="controls">
        <label class="checkbox line">
            <input type="checkbox" class="all" value="Todas" id="allstates" name="st[25]"/>All
        </label>
        <label class="checkbox line">
            <input type="checkbox" value="Caba" id="" name="st[1]"/>Ciudad Autónoma de Buenos Aires
        </label>
        <label class="checkbox line">
            <input type="checkbox" value="Buenos Aires" id="" name="st[2]"/> Buenos Aires
        </label>
        <label class="checkbox line">
            <input type="checkbox" value="Catamarca" id="" name="st[3]"/> Catamarca
        </label>
        <label class="checkbox line">
            <input type="checkbox" value="Chaco" id="" name="st[4]"/> Chaco
        </label>
   </div>
  </div>
 </div>
</div>

这是我的 js 文件(带有其他功能):

$('.hide').hide();

$('#registered').click(function(){
 $('#content').toggle('fast');
});

$('#age').click(function () {
$('#content2').hide('fast');
$('#content1').show('fast');
});

$('#range').click(function () {
$('#content1').hide('fast');
$('#content2').show('fast');
});

$('#with').click(function(){
$('#child').toggle('fast');
});

$('#showstates').click(function(){
$('#states').show('fast');
});

$('#hidestates').click(function(){
$('#states').hide('fast');
});

//function for check/uncheck
$('.all').click(function() {
var $checkboxes = $(this).parent().find('input[type=checkbox]');
$checkboxes.prop('checked', $(this).is(':checked'));
});   

这是小提琴:http: //jsfiddle.net/jimena/j56Dy/ 这不起作用

4

1 回答 1

0

你需要上升两个阶段而不是一个阶段。parent() 为您提供标签元素,您需要转到“控件”分类的 div 以应用您的 find 方法:

var $checkboxes = $(this).parent().parent().find('input[type=checkbox]');

当然,这是对您的代码方式进行最小的更改。Joe 在这里提供的可能更聪明:获得所有你想要的复选框,而不必使用 parent() 方法。但要这样做,您可能需要标识您的复选框组,这样您就不会选择整个 DOM 中的所有复选框。

顺便说一句,您是否不必在某些时候显示您的隐藏 div 才能看到您的复选框?

编辑> 好的,实际上 Manish 对父母是正确的,这是正确的,忘记我的回答:D

于 2013-10-22T14:18:13.127 回答