用于检查复选框的 jQuery 函数答案

【问题标题】：jQuery function in order to check checkboxes用于检查复选框的 jQuery 函数
【发布时间】：2012-07-26 17:04:21
【问题描述】：

我需要一些关于 jQuery 的帮助。

我有一个带有复选框的表单，例如：

<form name="myform">
<input type="checkbox" name="apple[]" value="12" />
<input type="checkbox" name="apple[]" value="12" />
<input type="checkbox" name="apple[]" value="14" />
<input type="checkbox" name="apple[]" value="15" />
<input type="checkbox" name="peach[]" value="12" />
<input type="checkbox" name="peach[]" value="14" />
<input type="checkbox" name="peach[]" value="15" />

这是已经尝试过的jQuery：

$(document).ready(function(){ 
    $(":checkbox").change(function(){ 
        if($('.peach').attr("checked")) { 
           alert("Checked"); 
        } 
        else { 
             alert("Unchecked"); 
        } 
     }); 
 });

当我选中一个名为“peach”的复选框时，我应该能够选中名为“apple”的复选框，其值与“peach”相同。因此，如果我以 12 为值选中“peach”，那么名称为“apple”且值为 12 的复选框也应被选中。

我是 jQuery 新手，所以我无法自己找到解决方案……有人可以帮我吗？ :-)

问候

费德里科

【问题讨论】：

如果您展示您尝试过的代码，而不是要求完整的解决方案，您将获得更好的响应。
SSCCE
我知道，但这完全没用，因为我什至无法成功管理“已检查”事件。我给桃子复选框一个“桃子类”并尝试了这个代码： $(document).ready(function(){ $(":checkbox").change(function(){ if($('.peach') .attr("checked")) { alert("Checked"); } else { alert("Unchecked"); } }); });但什么也没发生
这似乎可以做到，但它看起来甚至没有什么用处jsfiddle.net/XhRGg

标签： jquery forms checkbox checked

【解决方案1】：

尝试以下方法：

$('input[name^="peach"]').change(function() {
    var apple = $('input[name^="apple"][value='+ this.value +']') // phew
    if (this.checked) {
       apple.prop('checked', true)
    } else {
       apple.prop('checked', false)
    }       
})

Demo

【讨论】：

【解决方案2】：

检查这个小提琴工作链接。 http://jsfiddle.net/NfU68/

$('input').on('click', function() {
    var value = $(this).val();
    var checked = $(this).is(':checked');
    $('input[value='+value+']').attr('checked', checked)
});

在这里，您可以使用自己的基于类或父标签的选择器来代替输入。我已用于演示目的。

【讨论】：

感谢 Vins，但是我使用了更适合我的代码的 Raminson 脚本！ :-)
如您所愿...我建议您寻求通用解决方案，而不是针对会影响您的代码可扩展性的问题的具体解决方案。
我的代码遇到了什么问题？让我知道我会尽力解决它。

【解决方案3】：

以下解决方案会将on() 事件处理程序附加到checkbox 元素以捕获任何change 事件。然后它将获取当前 checkbox 元素的 value 并检查包含该值的所有其他 checkbox 元素。

$('input[type=checkbox]').on('change', function() {
    $('input[value='+this.value+']').attr('checked', $(this).is(':checked'));
});

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

对于 1.7 之前的版本，请改用 delegate()，因为此时 on() 不存在。

$(document).delegate('input[type="checkbox"]', 'change', function() {
    $('input[value='+this.value+']').attr('checked', $(this).is(':checked'));
});

演示：http://jsfiddle.net/8mQwV/

【讨论】：

谢谢 Rob，我尝试了你的解决方案，但我在使用 Raminson 的脚本方面做得更好