手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >jQuery实现表格与ckeckbox的全选与单选功能
jQuery实现表格与ckeckbox的全选与单选功能
摘要:先给大家介绍下jQuery实现表格与ckeckbox的全选与单选功能。先看看下面的效果:用户点击头的checkbox时,所有表格数据行的ch...

先给大家介绍下jQuery实现表格与ckeckbox的全选与单选功能。

先看看下面的效果:

jQuery实现表格与ckeckbox的全选与单选功能1

用户点击头的checkbox时,所有表格数据行的checkbox全选或反选。

当数据行某一行没有选中时,头checkbox去选。当所有数据行的checkbox全选时,头的checkbox也选上。

html代码示例,关注高亮部分即可:

jQuery实现表格与ckeckbox的全选与单选功能2

jQuery代码,可以参考如下:

jQuery实现表格与ckeckbox的全选与单选功能3

PS:js实现隐藏与显示铵钮功能

表格无数据行时,隐藏下面两个铵钮,反之显示它们,如下面代码示例:

jQuery实现表格与ckeckbox的全选与单选功能4

jQuery代码:

jQuery实现表格与ckeckbox的全选与单选功能5

看看效果:

jQuery实现表格与ckeckbox的全选与单选功能6

【jQuery实现表格与ckeckbox的全选与单选功能】相关文章:

基于JavaScript实现动态添加删除表格的行

js实现发送验证码后的倒计时功能

jquery实现的判断倒计时是否结束代码

js实现简单div拖拽功能实例

jquery判断至少有一个checkbox被选中的方法

jQuery的基本概念与高级编程

jQuery实现返回顶部功能

JQuery实现带排序功能的权限选择实例

js实现鼠标经过表格行变色的方法

jQuery zTree加载树形菜单功能

精品推荐
分类导航