9

我在处理取消选中所有复选框时遇到问题。当我单击切换所有复选框时，它可以选中所有复选框。但是，如果我取消选中全部切换复选框，则不会发生任何事情。所有复选框都未选中。以下是我在 javascript 中的编码： 

<script>
var isAllCheck = false;
function togglecheckboxes(cn){

    var cbarray = document.getElementsByName(cn);
    for(var i = 0; i < cbarray.length; i++){

        if( isAllCheck == false ){
            cbarray[i].checked = "true";
            //alert( "it is false" );
        }else{ 
            cbarray[i].removeAttribute("checked");
            //alert( "it is true" );
        }
}   
isAllCheck = !isAllCheck;   
}
</script>

我什至尝试过这种编码，但仍然失败：

<script>
var isAllCheck = false;
function togglecheckboxes(cn){

    var cbarray = document.getElementsByName(cn);
    for(var i = 0; i < cbarray.length; i++){

        if( isAllCheck == false ){
            cbarray[i].checked = "true";
            //alert( "it is false" );
        }else{ 
            cbarray[i].checked = "false";
            //alert( "it is true" );
        }
}   
isAllCheck = !isAllCheck;   
}
</script>

以下是我的 PHP 编码供您参考：

echo "\t<div class='item'>
<span class='CDTitle'>{$cd['CDTitle']}</span>
<span class='CDYear'>{$cd['CDYear']}</span>
<span class='catDesc'>{$cd['catDesc']}</span>
<span class='CDPrice'>{$cd['CDPrice']}</span>
<span class='chosen'><input type='checkbox' name='cd[]' value='{$cd['CDID']}' title='{$cd['CDPrice']}' /></span>
</div>\n";

有关解决此问题的任何提示。提前致谢！

4

5 回答 5

7

问题归结为您如何设置checkedcheckox 的属性。您正在分配一个带有“true”的字符串，您应该在其中分配布尔值true。

所以修复你的代码很容易：

if( isAllCheck == false ){
    cbarray[i].checked = true;
}else{ 
    cbarray[i].checked = false;
}

或者，更简洁地说

cbarray[i].checked = !isAllCheck

现场示例：http: //jsfiddle.net/SEJZP/

于 2013-03-26T15:01:43.610 回答
7

更新

根据评论，Array.from在现代浏览器上不再需要，所以你可以这样做

document.querySelectorAll('input[type=checkbox]').forEach(el => el.checked = isAllCheck);

原始答案

在用你的 UI 逻辑验证这isAllCheck是正确的之后，你可以用一个简单的 vanilla-js one-liner 来做这两个

Array.from(document.querySelectorAll('input[type=checkbox]')).forEach(el => el.checked = isAllCheck);
于 2020-08-17T19:16:01.520 回答
4 

function uncheckElements()
{
 var uncheck=document.getElementsByTagName('input');
 for(var i=0;i<uncheck.length;i++)
 {
  if(uncheck[i].type=='checkbox')
  {
   uncheck[i].checked=false;
  }
 }
}

于 2019-10-08T12:48:26.860 回答
1

您也可以将其设为布尔变量。

<script>
var isAllCheck = new Boolean(false);
function togglecheckboxes(cn){

var cbarray = document.getElementsByName(cn);
for(var i = 0; i < cbarray.length; i++){

    if(isAllCheck){ //and then you could make this shorter.
        cbarray[i].checked = true;
        //alert( "it is false" );
    }else{ 
        cbarray[i].removeAttribute("checked");
        //alert( "it is true" );
    }
}   
isAllCheck = !isAllCheck;   
}
</script>
于 2018-02-25T22:27:19.197 回答
0

尝试这个

    <script>
var isAllCheck = false;
function togglecheckboxes(master,cn){

    var cbarray = document.getElementsByName(cn);
    for(var i = 0; i < cbarray.length; i++){

        if( isAllCheck == false ){
            cbarray[i].checked = true;
            //alert( "it is false" );
        }else{ 
            cbarray[i].checked = false;
            //alert( "it is true" );
        }
}   
isAllCheck = !isAllCheck;   
}
</script>
于 2013-03-26T14:52:05.930 回答