使用javascript验证下拉列表?

时间:2013-08-07 19:39:02

标签: javascript jquery html5

<FORM NAME="form1" METHOD="POST" ACTION="survey.php">
    <P>q1: How do you rate Ahmed Ebaid?
        <P>
            <INPUT TYPE='Radio' Name='q1' value='1' id='q1'>1
            <P>
                <INPUT TYPE='Radio' Name='q1' value='2' id='q1'>2
                <P>
                    <INPUT TYPE='Radio' Name='q1' value='3' id='q1'>3
                    <P>
                        <INPUT TYPE='Radio' Name='q1' value='4' id='q1'>4
                        <P>
                            <INPUT TYPE='Radio' Name='q1' value='5' id='q1'>5<span style='color:red' id='radio_error'></span><pre class='xdebug-var-dump' dir='ltr'><small>string</small> <font color='#cc0000'>', 1'</font> <i>(length=3)</i>
</pre>
                            <p>q2: Who is your best best friend?</BR>
                                <select name='q21' id='q2'>
                                    <option value='0'>Select a Name</option>
                                    <option value='2001'>Ahmed Ebaid</option>
                                    <option value='2002'>Jaida ElTayeby</option>
                                    <option value='2003'>Farida Ebaid</option>
                                    <option value='2005'>Kenny Andersen</option>
                                    <option value='2006'>Nadine Saad</option>
                                    <option value='2007'>AbdElHai Ebaid</option>
                                    <option value='2008'>Salwa AbdElAal</option>
                                </select>
                                <select name='q22' id='q2'>
                                    <option value='0'>Select a Name</option>
                                    <option value='2001'>Ahmed Ebaid</option>
                                    <option value='2002'>Jaida ElTayeby</option>
                                    <option value='2003'>Farida Ebaid</option>
                                    <option value='2005'>Kenny Andersen</option>
                                    <option value='2006'>Nadine Saad</option>
                                    <option value='2007'>AbdElHai Ebaid</option>
                                    <option value='2008'>Salwa AbdElAal</option>
                                </select>
                                <select name='q23' id='q2'>
                                    <option value='0'>Select a Name</option>
                                    <option value='2001'>Ahmed Ebaid</option>
                                    <option value='2002'>Jaida ElTayeby</option>
                                    <option value='2003'>Farida Ebaid</option>
                                    <option value='2005'>Kenny Andersen</option>
                                    <option value='2006'>Nadine Saad</option>
                                    <option value='2007'>AbdElHai Ebaid</option>
                                    <option value='2008'>Salwa AbdElAal</option>
                                </select>
                                <P>q3: How do you rate AbdElHai Ebaid?
                                    <P>
                                        <INPUT TYPE='Radio' Name='q3' value='1' id='q3'>1
                                        <P>
                                            <INPUT TYPE='Radio' Name='q3' value='2' id='q3'>2
                                            <P>
                                                <INPUT TYPE='Radio' Name='q3' value='3' id='q3'>3
                                                <P>
                                                    <INPUT TYPE='Radio' Name='q3' value='4' id='q3'>4
                                                    <P>
                                                        <INPUT TYPE='Radio' Name='q3' value='5' id='q3'>5<span style='color:red' id='radio_error'></span>
                                                        <p>q4: Who is your best best friend?</BR>
                                                            <select name='q41' id='q4'>
                                                                <option value='0'>Select a Name</option>
                                                                <option value='2001'>Ahmed Ebaid</option>
                                                                <option value='2002'>Jaida ElTayeby</option>
                                                                <option value='2003'>Farida Ebaid</option>
                                                                <option value='2005'>Kenny Andersen</option>
                                                                <option value='2006'>Nadine Saad</option>
                                                                <option value='2007'>AbdElHai Ebaid</option>
                                                                <option value='2008'>Salwa AbdElAal</option>
                                                            </select>
                                                            <select name='q42' id='q4'>
                                                                <option value='0'>Select a Name</option>
                                                                <option value='2001'>Ahmed Ebaid</option>
                                                                <option value='2002'>Jaida ElTayeby</option>
                                                                <option value='2003'>Farida Ebaid</option>
                                                                <option value='2005'>Kenny Andersen</option>
                                                                <option value='2006'>Nadine Saad</option>
                                                                <option value='2007'>AbdElHai Ebaid</option>
                                                                <option value='2008'>Salwa AbdElAal</option>
                                                            </select>
                                                            <select name='q43' id='q4'>
                                                                <option value='0'>Select a Name</option>
                                                                <option value='2001'>Ahmed Ebaid</option>
                                                                <option value='2002'>Jaida ElTayeby</option>
                                                                <option value='2003'>Farida Ebaid</option>
                                                                <option value='2005'>Kenny Andersen</option>
                                                                <option value='2006'>Nadine Saad</option>
                                                                <option value='2007'>AbdElHai Ebaid</option>
                                                                <option value='2008'>Salwa AbdElAal</option>
                                                            </select>
                                                            <select name='q44' id='q4'>
                                                                <option value='0'>Select a Name</option>
                                                                <option value='2001'>Ahmed Ebaid</option>
                                                                <option value='2002'>Jaida ElTayeby</option>
                                                                <option value='2003'>Farida Ebaid</option>
                                                                <option value='2005'>Kenny Andersen</option>
                                                                <option value='2006'>Nadine Saad</option>
                                                                <option value='2007'>AbdElHai Ebaid</option>
                                                                <option value='2008'>Salwa AbdElAal</option>
                                                            </select>
                                                            <P>q5: How do you rate the attitude of Farida Ebaid?
                                                                <P>
                                                                    <INPUT TYPE='Radio' Name='q5' value='1' id='q5'>1
                                                                    <P>
                                                                        <INPUT TYPE='Radio' Name='q5' value='2' id='q5'>2
                                                                        <P>
                                                                            <INPUT TYPE='Radio' Name='q5' value='3' id='q5'>3
                                                                            <P>
                                                                                <P><span style='color:red' id='radio_error'></span>
                                                                                    <p>
                                                                                        <INPUT TYPE='hidden' Name='h2' VALUE=', 1'>
                                                                                        <p>
                                                                                            <INPUT TYPE="Submit" Name="Submit1" VALUE="Click here to vote">

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script>
    $(function(){
        if ($('form').length > 0) {
            $('form').submit(function(e){
                var answers = '';
        var len = 5;
                $('input[type=Radio]:checked').each(function() {
                    if (answers !== '') {
                        answers += ',';
                    }
                    answers += $(this).val();
            //alert(answers);
                })
                $('input[name=h2]').val(answers);       
        for (var i = 1; i <= len; i++ ) {
            var qNum = 'q'+i;
            //document.write(qNum);
            if ($('#'+qNum+'').is(':radio')) {
                if (($('input[name='+qNum+']:checked').length == 0) ){
                    alert("No Selection is made for "+ qNum);
                    return false;
                }
            }
            else if ($('#'+qNum+'').is('select')) {
                var j = 1;
                var nominatefriend = qNum+j;
                alert (nominatefriend);
                var check = '';
                var chosen = new Array();
                while (check = document.getElementsByName("nominatefriend")) {
                    alert(check);
                    var len = document.form1[nominatefriend].length;
                    alert (len);
                    for (var i = 0; i < len; i++) {
                        if (document.form1[nominatefriend[i]].selected) {
                            chosen[j] = document.form1.nominatefriend[i].value;
                            alert (chosen[j]);
                        }
                    }
                    j++;
                    nominatefriend = qNum+j;
                    alert (nominatefriend);
                }
            }
        }   // for loop        
            }); // form submit function

        }// form.length
    })//function

尝试执行上述代码时,出现以下错误:TypeError:document.form1 [nominatefriend [i]]。已选中。 我正在使用nominatefriend [i]迭代所有选项,但这对我没有任何意义。

1 个答案:

答案 0 :(得分:1)

你声明一个这样的变量,所以它是一个数字(整数)

var nominatefriend = qNum+j;

然而,您可以像数组一样访问它:

document.form1[nominatefriend[i]].selected

对于二维数组,您需要

document.form1[nominatefriend][i].selected

但是,还要注意评论,特别是关于文档中重复ID的评论。