无法接收来自复选框的数据

Question

我试图在检查它们时收到两个复选框组的值。但是，如果我更改这些组的检索顺序，则无法接收数据。

HTML：

<div class="btn-group" data-toggle="buttons">//Hai 
    <p>CheckBox Group1:</p> 
    <input type="checkbox" name="hai" value="option1" onClick="cbChanged(this);">option 1 
    <input type="checkbox" name="hai" value="option2" onClick="cbChanged(this);">option 2 
</div> 

<div class="btn-group" data-toggle="buttons">//Hello 
    <p>CheckBox Group2:</p> 
    <input type="checkbox" name="hello" value="option3" onClick="cbChanged(this);">option 3 
    <input type="checkbox" name="hello" value="option4" onClick="cbChanged(this);">option 4 
</div> 

JS：

//Gets hit when a checkbox has been checked/unchecked 
cbChanged = function (checkboxElem) 
{ 
    getSelectedCB(); 
} 

//Called by above function 
function getSelectedCB() 
{ 
    var result = ""; 
    //Gets value from checkbox group hai 
    var c1 = getcb1(); 
    alert(c1); 
    //Gets value from checkbox group hello 
    var c2 = getcb2(); 
    alert(c2); 
    result=c1+c2; 
    alert(result); 
} 

//gets value from checkbox group hai 
function getcb1() 
{ 
    var res=""; 
    var cb1 = getCheckedBoxes("hai"); 
    for (var i = 0; i < cb1.length; i++) 
    { 
     res = res + cb1[i].value + "+"; 
    } 

    return res; 
} 

//gets value from checkbox group hello 
function getcb2() 
{ 
    var res=""; 
    var cb2 = getCheckedBoxes("hello"); 
    for (var i = 0; i < cb2.length; i++) 
    { 
     res = res + cb2[i].value + "+"; 
    } 
    return res; 
} 

//Function to gets the values 
function getCheckedBoxes(chkboxName) 
{ 
var checkboxes = document.getElementsByName(chkboxName); 
    var checkboxesChecked = []; 
    // loop over them all 
    for (var i = 0; i < checkboxes.length; i++) 
    { 
     // And stick the checked ones onto an array... 
     if (checkboxes[i].checked) 
     { 
      checkboxesChecked.push(checkboxes[i]); 
     } 
    } 


    // Return the array if it is non-empty, or null 
    return checkboxesChecked.length > 0 ? checkboxesChecked : null; 
} 

问题：

当我选择复选框组2 [你好]之前复选框组1 [海]我无法接收数据。但是当我在“你好”之前选择“海”时，我能够接收数据。

如果我犯了一些愚蠢的错误，请耐心等待。

Answer 1

试试这个：

http://jsfiddle.net/thespacebean/hqQF3/

if语句，你应该换的循环中的，否则它是试图让那并不是一个数组的长度”只有一个设置被检查时才存在。当你第一次检查第二组时，它不起作用的原因是因为没有检查它在执行getcb1（）时会中断。

//Gets hit when a checkbox has been checked/unchecked 
    cbChanged = function (checkboxElem) 
    { 
     getSelectedCB(); 
    } 
    //Called by above function 
    function getSelectedCB() 
    { 
     var result = ""; 
     //Gets value from checkbox group hai 
     var c1 = getcb1(); 
     alert(c1); 
     //Gets value from checkbox group hello 
     var c2 = getcb2(); 
     alert(c2); 
     result=c1+c2; 
     alert(result); 
    } 
    //gets value from checkbox group hai 
    function getcb1() 
    { 

    var res=""; 
    var cb1 = getCheckedBoxes("hai"); 
     if(cb1) { 
      for (var i = 0; i < cb1.length; i++) 
      { 
      res = res + cb1[i].value + "+"; 
     } 

     }  
    return res; 
} 
//gets value from checkbox group hello 
function getcb2() 
{ 
    var res=""; 
    var cb2 = getCheckedBoxes("hello"); 
    if(cb2) { 
     for (var i = 0; i < cb2.length; i++) 
     { 
      res = res + cb2[i].value + "+"; 
     } 
    } 
    return res; 
} 
//Function to gets the values 
function getCheckedBoxes(cb) { 
    var checkboxes = document.getElementsByName(cb); 
    //console.log(checkboxes.length); 
    var checkboxesChecked = []; 
      // loop over them all 

     for (var i = 0; i < checkboxes.length; i++) { // And stick the checked ones onto an array... 
      if (checkboxes[i].checked) { checkboxesChecked.push(checkboxes[i]); } 
     // Return the array if it is non-empty, or null 

     } 
      return checkboxesChecked.length > 0 ? checkboxesChecked : []; 

} 

Answer 2

的这部分代码：

//Function to gets the values 
function getCheckedBoxes(cb) 
{ 
var checkboxes = document.getElementsByName(chkboxName); 
    var checkboxesChecked = []; 
    // loop over them all 
    for (var i = 0; i < checkboxes.length; i++) 
    { 
     // And stick the checked ones onto an array... 
     if (checkboxes[i].checked) 
     { 
      checkboxesChecked.push(checkboxes[i]); 
     } 
    } 


    // Return the array if it is non-empty, or null 
    return checkboxesChecked.length > 0 ? checkboxesChecked : null; 
} 

我假设你的意思，而不是chkboxName它应该是CB？试着改变它，看看它是否能解决你的问题。

Answer 3

只需在getCheckedBoxes结尾处返回[]而不是null（或者仅返回checkboxesChecked）。返回null会导致它尝试调用.length对null，这会暂停您的函数在该点的执行。 （如果你绝对必须返回null，出于某种原因没有在这里显示，那么在你进入for循环之前在你的getcb1/getcb2函数中检查它，并且与任何东西无关，创建一个函数getcb并将'hai “或‘你好’。作为一个参数）