1

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

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;
}

问题：

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

如果我犯了一些愚蠢的错误，请多多包涵。

4

3 回答 3

1

只需在 getCheckedBoxes 末尾返回 [] 而不是 null（或仅返回 checkboxesChecked）。返回 null 会导致它尝试针对 null 调用 .length，这将在此时停止函数的执行。

（如果您因为某种未在此处显示的原因绝对必须返回 null，请在进入 for 循环之前在 getcb1/getcb2 函数中检查它。此外，与任何事情无关，创建一个函数 getcb 并传递 'hai' 或 'hello ' 作为参数。）

于 2013-10-19T17:42:25.973 回答
0

这部分代码：

//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;
}

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

于 2013-10-19T17:29:42.880 回答
0

尝试这个：

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 : [];

}
于 2013-10-19T17:57:42.260 回答