JQuery实现form表单全选 全不选 反选 获取选中的值
JQuery实现form表单全选全不选反选获取选中的值
<table>
<tr>
<td>
<input type="checkbox" name="all" />
<input type="button" name="checkAll" id="checkAll" value="全选" />
<input type="button" name="checkNo" id="checkNo" value="全不选" />
<input type="button" name="checkRev" id="checkRev" value="反选" />
<input type="button" name="getCheck" id="getCheck" value="获取选中的值" />
</td>
</tr>
<tr>
<td>
<input type="checkbox" name="check" value="奇异果"/>奇异果
<input type="checkbox" name="check" value="车厘子"/>车厘子
<input type="checkbox" name="check" value="苹果"/>苹果
<input type="checkbox" name="check" value="蜜瓜"/>蜜瓜
<input type="checkbox" name="check" value="芒果"/>芒果
<input type="checkbox" name="check" value="杨梅"/>杨梅
</td>
</tr>
</table>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$("input[name='all']").click(function () {
$("input[name='check']").prop("checked", this.checked);
});
$("#checkAll").click(function () {
$("input:checkbox").prop("checked", true);
});
$("#checkNo").click(function () {
$("input:checkbox").prop("checked", false);
});
$("#checkRev").click(function () {
$("input[name='check']").each(function () {
this.checked = !this.checked;
});
});
$("#getCheck").click(function () {
var checkVal = [];
$("input[name='check']:checked").each(function (i) {
checkVal[i] =$(this).val();
});
alert(checkVal)
});
</script>
奇异果 车厘子 苹果 蜜瓜 芒果 杨梅 |