Jquery选中一个复选框时选中所有复选框

问题描述：

我有一个从smarty模板构建的复选框数组。当用一个值为WTOPS的特定复选框被选中时，我想要这个动作来选择div中的所有其他复选框。这里是我的代码下方未工作Jquery选中一个复选框时选中所有复选框

这里是我的jQuery：

$("input[name=levelCheck]").change(function() { 
if ($("input[name=levelCheck]:checked").val() == 'WTOPS') { 
$("input[type='checkbox']").attr('checked', true); 
} 
});

这里是HTML：

<div id="Women"> 
<label> <input type="checkbox" name="level_desc[]" id="levelCheck" value="WOPEN"> Open </label> 
<label> <input type="checkbox" name="level_desc[]" id="levelCheck" value="WPREPOPT"> Prep Opt </label> 
<label> <input type="checkbox" name="level_desc[]" id="levelCheck" value="WTOPS"> TOPS </label> 
</div>

你的问题是什么？ – 2012-04-27 19:41:11

你没有用引号包装你的属性值......'input [name ='levelCheck']' - 尝试添加像这样的引号... – Lix 2012-04-27 19:41:29

你有3个输入具有相同的id - 针对这个非唯一id与jQuery会给你意想不到的结果。这对于一个班级来说是一个更好的例子。 id值应该总是唯一的。 – 2012-04-27 19:46:09

答

下面的脚本应该做的你有的标记技巧，

DEMO

$(function() { 
    $("input[name=level_desc\\[\\]]").change(function() {   
     if ($("input[name=level_desc\\[\\]]:checked").val() == 'WTOPS') { 
      $("input[type='checkbox']").attr('checked', true); 
     } 
    }); 
});

正如迈克尔指出，使用引号看起来更好，

$(function() { 
    $("input[name='level_desc[]']").change(function() {   
     if ($("input[name='level_desc[]']:checked").val() == 'WTOPS') { 
      $("input[type='checkbox']").attr('checked', true); 
     } 
    }); 
});

ugg ...我会**不**要喜欢看到我的代码... – Lix 2012-04-27 19:48:50

谢谢vega，那就是诀窍。周末愉快！ – 2012-04-27 19:49:26

当你只需要一个报价包装时，斜线？ – 2012-04-27 19:55:10

答

你$("input[name=levelCheck]:checked")应该$("input#levelCheck:checked")

答

试试这个：

$("input#levelCheck").change(function() { 
if ($("input#levelCheck:checked").val() == 'WTOPS') { 
$("input[type='checkbox']").attr('checked', true); 
} 
});

答

尝试针对特定复选框 - 不需要看他们所有。

$("input[value=WTOPS]:not(:checked)").change(function() { 
    $("input[type='checkbox']").attr('checked', 'checked'); 
});

当未选中或更改时，它特别针对WTOPS复选框。然后触发所有的复选框进行检查。这个问题没谈改变所有的选项选中当WTOPS箱未被选中，但这里有一个办法做到这一点：

$("input[value=WTOPS]").change(function() { 
    $("input[type='checkbox']").attr('checked', $("input[value=WTOPS]").val()); 
});

答

当你永远使用该属性值选择，你应该用引号括值 -

$("input[name='levelCheck']:checked");

注意引号包裹name='levelCheck'

答

您正在使用的ID属性不止一次，你需要在单引号包的名称值。

HTML

<div id="Women"> 
<label> <input type="checkbox" name="level_desc[]" id="levelCheck1" value="WOPEN"> Open </label> 
<label> <input type="checkbox" name="level_desc[]" id="levelCheck2" value="WPREPOPT"> Prep Opt </label> 
<label> <input type="checkbox" name="level_desc[]" id="levelCheck3" value="WTOPS"> TOPS </label> 
</div>

$("input[name='level_desc[]']").change(function() { 
    if ($("input[name='level_desc[]']:checked").val() == 'WTOPS') { 
     $("input[name='level_desc[]']").attr('checked', true); 
    } 
});

DEMO
http://jsfiddle.net/ScMsX/

答

试试这个

$("input[type='checkbox']").change(function() { 
    console.log($(this)); 
if ($(this).val() == 'WTOPS') { 
$("input[type='checkbox']").attr('checked', true); 
} 
});

入住这里http://jsfiddle.net/khqPj/

Jquery选中一个复选框时选中所有复选框

相关推荐