javascript - ajax 加载的单个复选框在 javascript 验证中显示未定义

Question

希尔，

我有简单的 HTML FROM

 <form id="adda" name="adda" method="post" action="">

    Select Batch :<br/>

    <select  name="standard" id="standard" onchange="return changestudent(this.value);"  >

        <option value="0">-Select Batch-</option>

         <option value="1">BatchName1</option>
              <option value="2">BatchName2</option>
    </select>


   Students :

    <div id="s">

    <input type="checkbox" name="sname"  value="<?=$raw2['Id']?>"  /><?=$raw2['FirstName']?> <?=$raw2['LastName']?><br />

    </div>

    <input type="button"  value="Add" onclick="return val();" style="width:80px; height:28px; color:#8A4E00; background-color:#8bc33f;cursor:pointer;margin-left:10px;" /> <? } ?>


    <input type="hidden"  name="hsid" id="hsid" value="" />

    <input type="hidden" name="sub" id="sub" value="1" />

    </form>

在下拉列表更改时，我调用了 javascript 函数changestudent()，它正在创建ajax 内容，显示该批处理具有ckeckboxes 的学生列表。这是ajax函数

    <script>
function changestudent(stdid)
{



    var strName="Msxml2.XMLHTTP"

            if (window.XMLHttpRequest)

            { // Mozilla, Safari, ...

                xmlhttp = new XMLHttpRequest();

            }

            else if (window.ActiveXObject)

            { // IE

                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");

            }   



            xmlhttp.open('GET', 'changestudent.php?stdid='+stdid+'&table=studentdetail', true);

            xmlhttp.onreadystatechange = showsub;   

            xmlhttp.send(null);

}

function showsub()

{

if (xmlhttp.readyState == 4)

{

    str = xmlhttp.responseText; 



    document.getElementById("s").innerHTML = str;

}

}


    </script>

我的问题是，当ajax返回单个复选框javascript函数时，我用来验证显示该复选框未定义的表单。

这是我用来验证表单的 javacript 函数

 <script type="text/javascript">
function val()

{



    if(document.adda.standard.value=="0")

    {

        alert("Please Select Batch");

        document.adda.standard.focus();

        return false;

    }


var cnt = 0;



    for(var i = 0;i < document.adda.sname.length;i++)

    {

        //alert("1");

        if(document.adda.sname[i].checked==true)

        {

            document.adda.hsid.value = document.adda.hsid.value+','+document.adda.sname[i].value; 

            cnt = cnt+1;

        }

    }

    if(cnt==0)

    {

    alert("Please Select Student");

    return false;

    }

    document.adda.submit();

谁能帮我解决这个问题吗？提前致谢

Answer 1

问题是 document.adda.sname 如果有多个具有该名称的复选框，则返回一个类似数组的对象，但是如果只有一个，则它返回复选框对象本身(因此您可以当只有一个语法时，不要使用 [i] 语法。

解决方案是使用其他东西来抓取复选框，例如 querySelectorAll，它总是返回类似数组的对象，无论找到多少个。

var checkboxes = document.querySelectorAll('form[name=adda] input[name=sname]');

for(var i=0; i<checkboxes.length; i++){
    if(checkboxes[i].checked){
        document.adda.hsid.value = document.adda.hsid.value+','+ checkboxes[i].value; 
        cnt = cnt+1;
    }
}