jQuery提高选择所有复选框功能

我有一个checkall脚本，通过复选框单击选中所有复选框。目前它工作的很好，但我需要在同一个窗体中的多个实例。所以我需要修改它以仅瞄准最接近的字段集。jQuery提高选择所有复选框功能

这里是工作的代码，也是这里是小提琴，http://jsfiddle.net/clintongreen/22w3B/

$('.checkall').click(function() { 
    var checked = $(this).data('checked'); 
    $('fieldset').find(':checkbox').attr('checked', !checked); 
    $(this).data('checked', !checked); 
});

，这里是我的失败尝试：

$('.checkall').click(function() { 
    var checked = $(this).data('checked'); 
    var next_set = $('fieldset').next(); 
    $(next_set).find(':checkbox').attr('checked', !checked); 
    $(this).data('checked', !checked); 
});

来源

2012-05-04 Clinton Green

你不能给每个字段集一个不同的ID或类，那么只需使用$（'＃fieldsetID：checkbox'） – DanRedux

嗨，我可以但我试图避免必须为每个字段集创建不同的函数，因为这将是一个漫长的一页。欢呼 –

最好绑定到复选框上的更改事件 - click复选框被选中之前触发click事件，所以您必须在使用该值之前反转该值。它变得混乱... –

只是从原来的尝试中改变了一行。

但是，为什么不直接给字段集自己的ID，使它更不易脆弱呢？

来源

2012-05-04 00:35:13

非常感谢！我并不热衷于提供ID，因为我不想为每个字段集创建一个新的函数。干杯 –

你看着“最近（）”函数JQUERY？

http://api.jquery.com/closest/

来源

2012-05-04 00:29:09 Chase

获得最接近的字段集与.parents("li").next("fieldset")，并设置它的checked属性为“检查”：

$(".checkall").click(function(){ 
    $("input[type='checkbox']", 
     $(this).parents("li") 
       .next("fieldset")) 
    .attr("checked","checked"); 
});

来源

2012-05-04 00:29:35

嗨，我试过，但它没有工作，奇怪，因为这看起来像正确的解决方案。干杯 –

哦，在编写这个脚本之前，我没有检查DOM，最好使用'parents（“li”）。next（“fieldset”）'而不是'nearest（“fieldset”）''。 –

有多种方法可以做到这一点，但IMO最简单的就是移动“选择所有“复选框放入字段集中，然后：

$('.select-all').change(function() { 
    var new_value = this.checked; 
    $(this).closest('fieldset').find('input:checkbox').each(function() { 
    if (!$(this).hasClass('select-all')) { 
     this.checked = new_value; 
    } 
    }); 
});

来源

2012-05-04 00:31:26

jQuery提高选择所有复选框功能

回答

相关问题