导航首页 » 技术教程 » jQuery实现表格与ckeckbox的全选与单选功能
全站头部文字 我要出现在这里
jQuery实现表格与ckeckbox的全选与单选功能 349 2024-02-12   

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

先看看下面的效果:

查看图片

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

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

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

查看图片

jQuery代码,可以参考如下:

查看图片

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

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

查看图片

jQuery代码:

查看图片

看看效果:

查看图片



!!!站长长期在线接!!!

网站、小程序:定制开发/二次开发/仿制开发等

各种疑难杂症解决/定制接口/定制采集等

站长微信:lxwl520520

站长QQ:1737366103