<script type="text/javascript">
$(function(){
$("table tr:even").addClass("tdOdd");
$("th:first").css("background","#B4C6C1");//首个
$("table tr").mouseover(function(){
$(this).addClass("tdOver");}).mouseout(function(){
$(this).removeClass("tdOver");}).click(function(){//荧光棒
$(".tdClick").removeClass("tdClick");$(this).addClass("tdClick");
})//行锁定
$("input:checkbox:first").click(function(){
$("input:checkbox:not(input:checkbox:first)").each(function(){//剔除本身
$(this).attr( "checked",$("input:checkbox:first").attr("checked"));
})
})
$("input:checkbox:not(input:checkbox:first)").click(function(){
var flag=true;
$("input:checkbox:not(input:checkbox:first)").each(function(){
if(!this.checked){flag=false;}//不可使用if($(this).attr("checked","false")){flag=false;}<P></P>
});
$("input:checkbox:first").attr("checked",flag);
})
});
</script>
<style type="text/css">
body{
font-size:12px;
color:#366;
}
table{
border:none;
background:#fefefe;
width:100%;
border-collapse:collapse;
}
th{
background:#CFDEC6;
padding:4px;
color:#000;
}
td,.tdNormal{
border:#cfdec6 solid 1px;
padding:4px;
background:fefefe;
}
.tdOdd{
background:#f1fefa;
}
.tdOver{
background:#F5FAF7;
}
</style>
</head>
<body>
<table>
<tr>
<th>姓名</th>
<th>年龄</th>
<th>专业</th>
</tr>
<tr>
<td>王洪剑</td>
<td>22</td>
<td>电气自动化</td>
</tr>
<tr>
<td>李川川</td>
<td>20</td>
<td>计算机</td>
</tr>
<tr>
<td>陈超</td>
<td>22</td>
<td>计算机</td>
</tr>
<tr>
<td>秦玉龙</td>
<td>21</td>
<td>计算机</td>
</tr>
<tr>
<td>刘威</td>
<td>21</td>
<td>计算机</td>
</tr>
<tr>
<td>张会会</td>
<td>21</td>
<td>计算机</td>
</tr>
<tr>
<td>胡海生</td>
<td>30</td>
<td>计算机</td>
</tr>
<tr>
<td>吴雄</td>
<td>22</td>
<td>计算机</td>
</tr>
</table>
详细解决方案
jquery+css兑现表格隔行换色、荧光棒特效、复选框checkbox全选反选效果
热度:131 发布时间:2012-07-02 17:46:22.0
相关解决方案
- jquery 获取jsp页面的id解决方法
- jquery,二维数组取值。解决办法
- 求jquery.form.js+jquery.validate.min.js 用ajax提交表单的代码范例
- jquery 提交form表单不用插件的那种 如何提交
- jquery ajax回传没有值,该怎么处理
- jquery easyUI datagrid struts2有关问题
- jquery form 有关问题
- springmvc jquery ajax 提交复杂对象,415异常解决办法
- 应用Struts2 与 jquery,ajax验证用户注册,不用从数据库获取数据
- jquery ajax select解决方法
- jquery ajax返回值的有关问题
- jquery 的bind里面能不能获得返回值呢? 对小弟我很难的有关问题啊
- java+jquery easy ui + json + struts分页例子
- jquery easyui分页效率有关问题
- struts checkbox 页面显示
- jquery 如何获得动态添加后的子元素个数?
- 关于Struts2 jQuery Plugin的 Result,该如何处理
- Jquery 点击按钮实现图片翻页,该如何解决
- checkbox Action传值有关问题
- Jquery+json解决思路
- checkbox 批量剔除 后台接收不到 checkbox的values
- jquery post有关问题
- 求大神解决偏题 - jquery ajax
- jquery ui taps有关问题,求解!
- jquery easyui 如何设置标题列居左,里面的数据列居右
- jquery 表格插件tablesorter的表头有多行和colspan不能排序有关问题
- jquery-easyui中的datetimebox 哪位高手用过?如何改变日期格式?
- jquery easyui treegrid 级联勾选跟点击行不自动勾选checkbox
- jquery.load(*json) 解析不已。求帮忙
- 回答给分,动态创建的input checkbox 该如何取值,即判断是否选中