js react 全选和反选
onCheckAll = (data) => {
var CheckBox = document.getElementsByName(data);
for(let i=0;i<CheckBox.length;i++){
if(CheckBox[i].checked==true){
CheckBox[i].checked=false;
} else{
CheckBox[i].checked=true
}
};
} const columnWBS = [
{title:'WBS节点名称',dataIndex:'label'},
{title:'权限',dataIndex:'qx',
render: (text, record, index) =>(
<span >
<Button size="small" onClick={this.onCheckAll.bind(this,record.key)} style={{marginRight:'5px'}}> 全选</Button>
<span id="checkBoxWrap">
<input type="checkbox" name={record.key} style={{marginLeft:'5px'}}/> 添加
<input type="checkbox" name={record.key} style={{marginLeft:'5px'}}/> 删除
<input type="checkbox" name={record.key} style={{marginLeft:'5px'}}/> 编辑
<input type="checkbox" name={record.key} style={{marginLeft:'5px'}}/> 查看
</span>
</span> )}]
js react 全选和反选的更多相关文章
- JS实现全选、反选、不选
JS实现全选.反选.不选 效果图: 代码如下,复制即可使用: <!DOCTYPE html> <html> <head> <meta charset=&quo ...
- elementUI+JS实现全选与反选
在实际项目开发过程中,遇到的需求,需要实现全选以及取消全选等功能,主要使用ElementUI + JS来实现,具体代码如下: <!DOCTYPE html> <html lang=& ...
- 前端之 JS 实现全选、反选、取消选中
需求 制作如下可选表格,实现“全选”.“反选”.“取消”功能 代码示例 <!DOCTYPE html> <html lang="zh-CN"> <he ...
- 原生JS实现全选,反选
无样式,比较丑 <!DOCTYPE html><html><head><meta charset="UTF-8"><title ...
- js CheckBox 全选、反选
<h3>你最喜欢的水果是?</h3> <label><input type="checkbox"/>苹果</label> ...
- 2016年4月7日 js的全选和反选
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title> ...
- 用 JS(JavaScript )实现多选、全选、反选
JS小例题 学习内容: 需求 总结: 学习内容: 需求 用 JavaScript 实现全选.反选.多选 实现代码 <!DOCTYPE html PUBLIC "-//W3C//DTD ...
- Javascript全选,反选,全不选的实现代码
使用js实现全选.反选.全不选. 代码如下: <html> <head> <script type="text/javascript"> fun ...
- 夺命雷公狗-----React---28--小案例之react经典案例todos(全选和反选)完
这个功能实现的步骤如下所示: 最终实现全选和反选,代码如下所示: <!DOCTYPE html> <html lang="en"> <head> ...
随机推荐
- ELK日志分析 学习笔记
(贴一篇之前工作期间整理的elk学习笔记) ELK官网 https://www.elastic.co ELK日志分析系统 学习笔记 概念:ELK = elasticsearch + logstas ...
- WinForm各种关闭
Appication.Exit(); Environment.Exit(); System.Threading.Thread.CurrentThread.Abort(); Process.GetCur ...
- 【计数】51nod1677 treecnt
要将答案看做是小问题的贡献和 Description 给定一棵n个节点的树,从1到n标号.选择k个点,你需要选择一些边使得这k个点通过选择的边联通,目标是使得选择的边数最少. 现需要计算对于所有选择k ...
- 使Linux支持exFAT和NTFS格式的磁盘
Linux支持exFAT和NTFS Linux系统默认可以自动识别到fat32格式的盘,但fat32支持的文件不能大于4G,所以只能将移动硬盘和U盘格式化为NTFS和exFAT这两种格式的,对于U盘最 ...
- OpenWrt 路由器如何让 lan 口主机获得 ipv6 网络访问 -- 知乎
本文转自知乎: OpenWrt 路由器如何让 lan 口主机获得 ipv6 网络访问? - mistforest的回答 - 知乎https://www.zhihu.com/question/29667 ...
- GIMP矩形选框预圆形选框
矩形选框,四种框选模式,了解一下 Repalace the current selector Add to the current selection (shift键) Subtract from t ...
- php各种主流框架的优缺点总结
ThinkPHP ThinkPHP(FCS)是一个轻量级的中型框架,是从Java的Struts结构移植过来的中文PHP开发框架.它使用面向对象的开发结构和MVC模式,并且模拟实现了Struts的标签库 ...
- python-leepcode-作用解析 - 5-27
30 找不同 给定两个字符串 s 和 t,它们只包含小写字母. 字符串 t 由字符串 s 随机重排,然后在随机位置添加一个字母. 请找出在 t 中被添加的字母. 示例: 输入: s = "a ...
- pycharm添加wordcloud模块时报错:error: Microsoft Visual C++ 14.0 is required. Get it with "Microsoft Visual C++ Build Tools": http://landinghub.visualstudio.com/visual-cpp-build-tools
windows 7 32bit python3.6.3 32bit pycharm2018社区版 32bit 问题说明: 添加wordcloud模块时报错:error: Microsoft Visua ...
- I2C驱动框架(三)
参考:I2C子系统之platform_device初始化——smdk2440_machine_init() I2C驱动框架还应用了另一种总线-设备-驱动模型,平台设备总线platform_bus_ty ...