选中javascript中的所有复选框 - 使用不同值的数组复选框

时间:2013-08-05 10:07:44

标签: php javascript

JavaScript代码

function toggle(source) {

  console.log('here');
  checkboxes = document.getElementsByName('checkbox[]');

  for(var i=0, n=checkboxes.length;i<n;i++) {
       checkboxes[i].checked = source.checked;
    }
 }

PHP代码动态生成所有复选框

    <td><input name="checkbox[<?php echo $row['id']?>]" type="checkbox" id="checkbox" value="<?php echo $row['id']; ?>"></td>

根据上面的PHP代码 所有名称值都是动态生成的。 上面的Javascript代码无法选中所有复选框

请帮忙!


经过长时间的研究终于找到了解决我的关键问题的因素 - 选择&amp;检查所有具有不同名称,值,ID和相同类型的复选框。

function toggle (source) {
var checkboxes;
var len = document.frm1.elements.length;
var x = document.getElementById('all');

for(var i = 0 ; i< len;i++){

    if(document.frm1.elements[i].type == "checkbox")
        {

        checkboxes = document.frm1.elements[i];
        if(x.checked == true)
        {
            document.frm1.elements[i].checked = true;
        }
        else
        {
            document.frm1.elements[i].checked = false;
        }
           }

     /*if( isAllCheck == false ){
        document.frm1.elements[i].checked = "true";
        //alert( "it is false" );
    }else{ 
        document.frm1.elements[i].checked = "false";
        //alert( "it is true" );
    }
   isAllCheck = !isAllCheck; */


            }
     console.log(checkboxes);
     for(var i=0, n=checkboxes.length;i<n;i++) {

checkboxes[i].checked = source.checked;

       }

我希望这能帮助别人......

7 个答案:

答案 0 :(得分:2)

var inputs = document.getElementsByTagName("input");
var checkboxes=[];
for(var i = 0; i < inputs.length; i++) {
if(inputs[i].type == "checkbox") {
    checkboxes.push( inputs[i] ); 
}  
}

如果您想检查所有这些内容,则必须在inputs[i].checked = true;条件

中添加行if

提示:不要为复选框分配相同的ID !!!

答案 1 :(得分:1)

checked = false;
function ToggleAll(source) {
checkboxes = document.getElementsByName('course[]');
for(var i=0, n=checkboxes.length;i<n;i++) {
checkboxes[i].checked = source.checked;
}
}

HTML:
<input type='checkbox' name='checkall' onclick='ToggleAll(this);'> Select All
<input type='checkbox' id = 'course' name='course[]'>Val1
<input type='checkbox' id = 'course' name='course[]'>Val2

答案 2 :(得分:0)

这不会以这种方式工作,因为您的复选框都没有名称“checkbox []”。您可以通过为它们提供类并使用getElementsByClassName函数来获取所有复选框。因此,您获得复选框的行将如下所示:

var checkboxes = document.getElementsByClassname('yourClassName');

在html中,您只需为复选框指定“yourClassName”类。

请注意某些旧版浏览器的getElementsByClassname is not supported

答案 3 :(得分:0)

您的HTML产生了

  

&lt; td&gt;&lt; input name =“checkbox [1]”type =“checkbox”id =“checkbox”   值= “1” &GT;&LT; / TD&GT;

不一样
  

&lt; td&gt;&lt; input name =“checkbox []”type =“checkbox”id =“checkbox”   值= “1” &GT;&LT; / TD&GT;

让PHP自动选择您需要添加的所有复选框

  

&lt; td&gt;&lt; input name =“checkbox []”type =“checkbox”id =“checkbox”   值=“1”已选中&gt;&lt; / td&gt;

答案 4 :(得分:0)

使用jQuery,您应该可以执行类似

的操作
checkboxes = $('input[name^="checkbox"]');

获取名称以'checkbox'开头的所有输入元素

答案 5 :(得分:0)

将class =“toggle”分配给要与源切换的所有复选框。

var elemsToggle = document.getElementsByClassName("toggle");
  for(var i = 0; i < inputs.length; i++) {
    elemsToggle[i].checked = source.checked;
  }

此代码将选中或取消选中所有具有class =“toggle”的复选框,具体取决于源复选框的状态。

答案 6 :(得分:0)

您可以使用querySelectorAll

function toggle_checkbox(name) {
        checkboxes = document.querySelectorAll("input[name^='"+ name +"[']");

        for (var i = 0, n = checkboxes.length; i < n; i++) {
            checkboxes[i].checked = source.checked;
        }
}