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

2019/6/27 21:37:51

本文主要是介绍jQuery实现表格与ckeckbox的全选与单选功能,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

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

先看看下面的效果:

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

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

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

jQuery代码,可以参考如下:

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

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

jQuery代码:

看看效果:



这篇关于jQuery实现表格与ckeckbox的全选与单选功能的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程