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

问题：

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

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

Answer 1

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

（如果由于某种原因绝对必须返回null，那么在进入for循环之前，请在getcb1 / getcb2函数中检查它。另外，与任何东西无关，创建一个函数getcb并传递'hai'或'你好'作为参数。）

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

试试这个：

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

}

无法从复选框接收数据

3 个答案: