1、JS部分：
有时候碰到常用的checkbox选择的时候容易忘，今天有时间稍微记下来
<script src="../script/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
$(function () {
$("#btn1").click(function () {//全选
$("input[name='chekItem']").each(function () {
$(this).attr("checked",true);
});
});
$("#btn2").click(function () {//取消全选
$("input[name='chekItem']").removeAttr("checked");
});
$("#btn3").click(function () {//反选
$("input[name='chekItem']").each(function () {
if ($(this).attr('checked')) {
$(this).removeAttr('checked');
}
else {
$(this).attr("checked", true);
}
});
});
$("#btn4").click(function () {//选中所有偶数同时去掉奇数的选中
$("input[name='chekItem']:odd").each(function () {
$(this).attr("checked", true);
});
$("input[name='chekItem']:even").each(function () {
$(this).attr("checked", false);
});
});
$("#btn5").click(function () {//输出选中的值
var str = "";
$('input[name="chekItem"]:checked').each(function () {
str += $(this).val() + "
";
alert($(this).val());
});
alert(str);
});
})
</script>
HTML部分：
<body> <input type="checkbox" name="chekItem" value="苹果"/>苹果 <input type="checkbox" name="chekItem" value="香蕉"/>香蕉 <input type="checkbox" name="chekItem" value="葡萄"/>葡萄 <input type="checkbox" name="chekItem" value="桃子"/>桃子 <br /> <br /> <br /> <br /> <br /> <br /> <input type="button" id="btn1" value="全选" /> <input type="button" id="btn2" value="取消全选 " /> <input type="button" id="btn3" value="反选 " /> <input type="button" id="btn4" value="选中所有偶数 " /> <input type="button" id="btn5" value="输出选中的值 " /> </body>