365bet手机版下载

Js和jq实现全选和反选择

发布人:admin     发布时间:2019-01-26 04:25
前面有很多情况使用完整选择和反向选择。在这里,我将实现此功能供您参考。 在这里,我将首先粘贴我的html和css代码。 Divclass =“换行” 表 THEAD TR 它 Inputtype =“checkbox”id =“theadInp”/ / th 快递/ th 收件人/ th 电话/ th / tr / thead Tbodyid =“tbody” TR TD Inputtype =“复选框”/ / td Td顺丰/ td Td Zhang Da / td Td186 ***** 897 / tr TR TD Inputtype =“复选框”/ / td 押韵td / td Td张全蛋/ td Td186 ***** 897 / tr TR TD Inputtype =“复选框”/ / td Td Tact / Td Td Han Fei / td Td186 ***** 897 / tr TR TD Inputtype =“复选框”/ / td Td China Post / td Td卫庄/ td Td186 ***** 897 / tr / tbody / table / div 这是html部分,然后我附上了css部分的代码: *{ 填充:0; 保证金:0; 。 换行{ 宽度:300px; 保证金:100pxauto0; 表{ 边界崩溃:崩溃; 边界间距:0; 边缘:1pxsolid#c0c0c0; 宽度:300px; 钍, Td{ 边缘:1pxsolid#d0d0d0; 颜色:#404060; 填充:10px; Th{ 背景颜色:rgb(51,199.18); 来源:bold16px“微软Yahei”; 颜色:#fff; Td{ 来源:14px“微软Yahei”; Tbodytr{ 背景颜色:#f0f0f0; Tbodytr:悬停{ 光标:指针; 背景颜色:#fafafa; 所示设计如下: 好吧,让我们开始讨论关键点。在此之前,我们必须澄清我们的想法。只有澄清这些想法,我们才能做到。 我们需要通过单击第一个输入标签来更改所有输入标签的选择状态。 1。 首先,我们需要获得控制总选择状态的输入标签。我们称之为inputAll。 2。 然后将每个输入标签保存在矩阵中,我们称之为icheck 3。 单击inputAll更改状态,并让icheck中的条目随您的状态而变化。 代码如下: 窗口 Onload = function(){ //获取控制所有选项选择的输入标记 varinputAll =文件。 getElementById(“theadInp”); //得到tbody Vartbody =文件。 getElementById(“tbody”); //在tbody日获取儿子元素 Varicheck = tbody。 getElementsByTagName(“input”); 控制台 注册(icheck); //用于控制所有选举的事件绑定条目控制。 inputAll。 Onclick = function(){ //在tbody中滚动输入标记,将inputAll状态指定给icheck 对于(vari = 0; iicheck。 长度;我++){ Icheck[i]。 检查=这个。 修订 上面有评论,你可以肯定理解,没有困难,你不需要解释。 请看以下内容: 你认为这是问题的终点吗? 但事实并非如此。 还有一个小问题或内部,即当没有选择下列项不止一个,那么你也必须改变输入状态。这不仅仅是人们可以独自听到,这太不合理了。 对于(vari = 0; iicheck。 长度;我++){ //将事件链接到每个子元素 Icheck[i]。 Onclick = function(){ //当您单击它时,迭代icheck以查看它是否未被选中。 对于(varj = 0; jicheck。 长度;j ++){ //定义要记录的标志 Varflag = true; 是的(icheck[j]。 选中== false){ Flag = false; inputAll。 标记=标志; JQ实现方法: 是js的执行特别复杂,没关系,我们有一个更简单的实现,然后jq来实现 $(function(){ //实现所有选举 $(“#theadInp”)。 已激活('click',function(){ $(“tbodyinput:checkbox”)。 道具(“标记”,$(this)。 道具('标记')); }) $(“tbodyinput:checkbox”)。 已激活('click',function(){ //当所选择的长度等于该复选框的长度,允许该复选框控制选择和取消选择被设置为,否则它处于关闭状态。 是($(“tbodyinput:checkbox”)。 长度=== $(“tbodyinput:check”)。 长度){ $(“#theadInp”)。 道具(“已核实”,真实); }else{ $(“#theadInp”)。 道具(“已核实”,错误); }) }) 看,jq方法不是太简单,所以,你可以使用jq到达其他人的js
上一篇:[GH]重组人生长激素重组人生长激素       下一篇:Xo葡萄酒是一种可以饮用的葡萄酒。