脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-jQuery实现全选于反选功能,脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
小宝典致力于为广大程序猿(媛)提供高品质的代码服务,请大家多多光顾小站,小宝典在此谢过。 <!DOCTY
PE ht
ML P
ubLIC "-//W3C//DTD X
HTML 1.0 Trans
ITional//EN" "https://www.w3.
org/TR/xhtml1/DTD/xhtml1
-transitional.dtd">
<html
XMlns="https://www.w3.org/1999/xhtml">
<head>
&nbs
p; <title></title>
<style type="text/css">
table
img {
width:50px; h
eight:50px;
}
table
{
width:600px; height:400px;
}
table tr td{ border:solid 1px
#eee;}
</style>
<script src="
jquery1.7.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$('#chkall').click(function () {
$('table input[type=checkbox]').attr('checked', $(
this).is(':checked'));
if (this.checked) {
$('#sp1').text('取消全选');
}
else {
$('#sp1').text('全选');
}
})
$('#chk
revert').click(function () {
VAR allcheck = $('table input[type=checkbox]');
allcheck.
each(function () {
if ($(this).is(':checked')) {
$(this).attr('checked', false);
}
else {
$(this).attr('checked', true);
}
})
})
})
</script>
</head>
<body>
<p>
<input id="chkall" type="checkbox" /><span id="sp1">全选</span><input id="chkrevert" type="checkbox" />反选</p>
<table>
<tr>
<td>
操作
</td>
<td>
编号
</td>
<td>
名称
</td>
<td>
作者
</td>
<td>
封面
</td>
<td>
单价
</td>
</tr>
<tr>
<td>
<input id="Checkbox1" type="checkbox" />
</td>
<td>
001
</td>
<td>
三国演义
</td>
<td>
罗贯中
</td>
<td>
<img src="images/2.
jpg" />
</td>
<td>
45
</td>
</tr>
<tr>
<td>
<input id="Checkbox2" type="checkbox" />
</td>
<td>
002
</td>
<td>
西游记
</td>
<td>
吴承恩
</td>
<td>
<img src="images/3.jpg" />
</td>
<td>
40
</td>
</tr>
<tr>
<td>
<input id="Checkbox3" type="checkbox" />
</td>
<td>
003
</td>
<td>
水浒传
</td>
<td>
施耐庵
</td>
<td>
<img src="images/4.jpg" />
</td>
<td>
50
</td>
</tr>
<tr>
<td>
<input id="Checkbox4" type="checkbox" />
</td>
<td>
004
</td>
<td>
红楼梦
</td>
<td>
曹雪芹
</td>
<td>
<img src="images/5.jpg" />
</td>
<td>
100
</td>
</tr>
<tr>
<td>
<input id="Checkbox5" type="checkbox" />
</td>
<td>
005
</td>
<td>
家
</td>
<td>
巴金
</td>
<td>
<img src="images/6.jpg" />
</td>
<td>
45
</td>
</tr>
<tr>
<td>
<input id="Checkbox6" type="checkbox" />
</td>
<td>
006
</td>
<td>
茶馆
</td>
<td>
老舍
</td>
<td>
<img src="images/7.jpg" />
</td>
<td>
35
</td>
</tr>
</table>
</body>
</html>
觉得可用,就经常来吧! 脚本宝典 欢迎评论哦! js脚本,巧夺天工,精雕玉琢。小宝典献丑了!
脚本宝典总结
以上是脚本宝典为你收集整理的javascript代码实例教程-jQuery实现全选于反选功能全部内容,希望文章能够帮你解决javascript代码实例教程-jQuery实现全选于反选功能所遇到的问题。
如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。