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>

onchange of dropdown 我调用了 javascript 函数 changesstudent()，它正在创建 ajax 内容，显示具有该批次复选框的学生列表。这里是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;
    }
}