react 全选反选中checked怎么传值

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了react 全选反选中checked怎么传值相关的知识,希望对你有一定的参考价值。

click()
var CheckAll = document.getElementById('All');
var CheckBox = document.getElementsByName('box');
if (CheckAll.checked == true)
for (var i = 0; i < this.props.items.length.length; i++)
CheckBox[i].checked = false;
;
if (CheckAll.checked == false)
for (var i = 0; i < this.props.items.length.length; i++)
CheckBox[i].checked = true;
;
for (var i = 0; i < this.props.items.length.length; i++)
if (CheckBox[i].checked == true)
CheckBox[i].checked = false;

else
CheckBox[i].checked = true;

;
this.setState(
this.state.checked = checked
);

render()
let items = [];
if(this.props.items.length == 0)
items.push(<tr><th colSpan="5" className="tempEmpty">暂无用户</th></tr>);
else
this.props.items.forEach(item =>
items.push(<StaffItem key=item.key item=item removeStaffItem=this.props.removeStaffItem detailStaffItem=this.props.detailStaffItem/>);
);


return (
<table className='itemPanel'>
<thead>
<th> <input type="checkbox" id='all' onChange=this.click.bind(this) /> </th>
<th className='itemTd'>姓名</th>
<th className='itemTd'>年龄</th>
<th className='itemTd'>身份</th>
<th className='itemTd'>性别</th>
<th className='itemTd'>操作</th>
</thead>
<tbody><td className='itemTd'><input type="checkbox" classname='box' checked=this.state.checked onChange=this.click.bind(this)/></td></tbody>
</table>
);

参考技术A Failed to create directory
CCLOG("AssetsManagerEx : can not create directory %s\n", fullPath.c_str());
unzClose(zipfile);
return false;

JS 全选全不选反选

function checkReturn(obj) {
                var objIds = obj.value;
                //当没有选中某个子复选框时,checkboxall取消选中
                if (!$("#subcheck").checked) {
                    $("#checkboxall").attr("checked", false);
                }
                // 获取subcheck的个数
                var chsub = $("input[type=‘checkbox‘][id=‘subcheck‘]").length;
                // 获取选中的subcheck的个数 
                var checkedsub = $("input[type=‘checkbox‘][id=‘subcheck‘]:checked").length;
                if (checkedsub == chsub) {
                    // 控制全选按钮的选中
                    $("#checkboxall").attr("checked", true); 
                }
            }
            function funcCheckAll() {
                   // 判断全选按钮是否是已选中状态
                   // $("#checkboxall").prop("checked")说明已选中
                   // JQuery版本不同,if条件不同
                   if ($("#checkboxall").prop("checked")) {
                       // 将各个子单选按钮设为选中状态
                       $(‘input[name=ids]‘).attr(‘checked‘, ‘checked‘);
                   } else { // 此时全选按钮起到反选作用
                        // 将选中状态改为非选中
                       $(‘input[name=ids]‘).removeAttr(‘checked‘);
                   }
                   // 将‘全不选‘按钮置为非选中状态
                   $(‘input[name=checkboxNotall]‘).removeAttr(‘checked‘);
                   // 将‘反选‘按钮置为非选中状态
                   $(‘input[name=checkboxInverse]‘).removeAttr(‘checked‘);
            }
            function funcCheckNotAll() {
                    // 将选中状态改为非选中
                   $(‘input[name=ids]‘).removeAttr(‘checked‘);
                   // 将‘全选‘按钮置为非选中状态
                   $(‘input[name=checkboxbutton]‘).removeAttr(‘checked‘);
                   // 将‘反选‘按钮置为非选中状态
                   $(‘input[name=checkboxInverse]‘).removeAttr(‘checked‘);
            }
            function funcCheckInverse() {
                // 将‘全选‘按钮置为非选中状态
                   $(‘input[name=checkboxbutton]‘).removeAttr(‘checked‘);
                   // 将‘全不选‘按钮置为非选中状态
                   $(‘input[name=checkboxNotall]‘).removeAttr(‘checked‘);
                   // 获取所有子选框
                   var checkDelete = document.getElementsByName("ids");
                   for(var i=0; i<checkDelete.length; i++) {
                       // 判断全选按钮是否是已选中状态
                       if (checkDelete[i].type == "checkbox" && checkDelete[i].checked) {
                           // 将子选框设为非选中状态
                           checkDelete[i].checked = false;
                       } else { 
                           // 将子选框设为选中状态
                           checkDelete[i].checked = true;
                       }
                   }
            }

 

以上是关于react 全选反选中checked怎么传值的主要内容,如果未能解决你的问题,请参考以下文章

JS实现全选不选反选

点击按钮全选,所有复选框选中,再次点击,全部取消选中js

JS 全选全不选反选

jq checkbox的操作——全选反选

attr()与prop()之全选反选问题

EBS FORM进阶2. Checkbox全选反选