javascript - onsubmit が JavaScript 関数に失敗しています

Question

以下のコードには、新しいユーザーのログインを作成するためのフォームがあります。そして、続行ボタンを押すと、「validateForm()」関数を呼び出す必要があります。フォームに入力された値をチェックし、適切な値が欠落している場合は、警告メッセージを表示する必要があります。しかし、フォームが完全に空であっても「続行」を押しているように、エラーが発生してもアラートは出されません。

<html>
<head>
<title></title>
<script type="text/javascript">
function validateForm()
{
    var email=document.forms["newlogin"]["email"].value;
    var cemail=document.forms["newlogin"]["cemail"].value;
    var pass=document.forms["newlogin"]["pwd"].value;
    var cpass=document.forms["newlogin"]["cpwd"].value;
    var answ1=document.forms["newlogin"]["ans1"].value;
    var answ2=document.forms["newlogin"]["ans2].value;

    alert("I am IN");

    if(email==null || email=="" || cemail==null || cemail=="") {
        alert("Enter Email ID and confirm.");
        return false;
    }
    if(pass==null || pass=="" || cpass==null || cemail=="") {
        alert("Enter Password and confirm.");
        return false;
    }
    if(answ1==null || answ1=="" || answ2=null || answ2=="") {
        alert("Enter Answer 1 & Answer 2.");
        return false;
    }
    if(email!=cemail) {
        alert("Confirmed Email ID is not matching.");
        return false;
    }
    if(pass!=cpass) {
        alert("Confirmed Password is not matching.");
        return false;
    }
}
</script>
</head>


<body>
<h1 style="font:swis721 bt">enginenc</h1>
<form name="newlogin" method="POST" action="http://localhost/cgi-bin/createlogin" onsubmit="return validateForm()">
    <table align="center" cellpadding="10" cellspacing="0" style="margin-top:2cm;background-color:#FFD700;border-top:1px solid;border-bottom:1px solid;border-left:1px dotted;border-right:1px dotted" border=0>
        <tr>
            <td align="left" style="font:westwood let">Enter a valid Email ID:</td>
            <td align="left" style="font:westwood let"><input type="text" name="email"></td>
        </tr>
        <tr>
            <td align="left" style="font:westwood let">Confirm the Email ID:</td>
            <td align="left" style="font:westwood let"><input type="text" name="cemail"></td>
        </tr>
        <tr>
            <td align="left" style="font:westwood let">Enter password:</td>
            <td align="left" style="font:westwood let"><input type="password" name="pwd"></td>
        </tr>
        <tr>
            <td align="left" style="font:westwood let">Confirm Passowrd:</td>
            <td align="left" style="font:westwood let"><input type="password" name="cpwd"></td>
        </tr>
        <tr>
            <td align="left" style="font:westwood let">Select Question 1:</td>
            <td align="left" style="font:westwood let"><select name="ques1"><option value=1>1. What is your mother's maiden name?</option><option value=2>2. Which is your birth city?</option><option value=3>3. Which is your favorite place?</option></select></td>
        </tr>
        <tr>
            <td align="left" style="font:westwood let">Answer 1:</td>
            <td align="left" style="font:westwood let"><input type="text" name="ans1"></td>
        </tr>
        <tr>
            <td align="left" style="font:westwood let">Select Question 2:</td>
                        <td align="left" style="font:westwood let"><select name="ques2"><option value=1>1. Which is your dream car?</option><option value=2>2. What is your nick name?</option><option value=3>3. Who is your favorite singer?</option></select></td>
        </tr>
        <tr>
                        <td align="left" style="font:westwood let">Answer 2:</td>
                        <td align="left" style="font:westwood let"><input type="text" name="ans2"></td>
                </tr>
        <tr>
            <td align="left" style="font:westwood let"><input style="margin-left:3cm;padding:11px" type="submit" value="Continue"></td>
            <td align="left" style="font:westwood let"><input style="padding:11px" type="reset"></td>
        </tr>
    </table>
</form>
</body>
</html>

ここでは、onsubmit()="return validateForm()"関数を使用してフォームを送信します。フォームが関数validateForm()を呼び出していません。私はたくさん試しましたが、エラーは見つかりませんでした。助けてください。ありがとう。

score 0 · Accepted Answer

タイプミスがあります：

var answ2=document.forms["newlogin"]["ans2].value;- ない "

if(answ1==null || answ1=="" || answ2=null || answ2=="")-欠落==

その後、それは動作するはずです。

score 0 · Accepted Answer

変化する

var answ2=document.forms["newlogin"]["ans2].value;

に

var answ2=document.forms["newlogin"]["ans2"].value; //missing quote

と

if(answ1==null || answ1=="" || answ2=null || answ2=="") {

に

if(answ1==null || answ1=="" || answ2==null || answ2=="") {

score 0 · Accepted Answer

呼び出し関数の単語 " this " に追加してみてください:<form name="newlogin" method="POST" action="http://localhost/cgi-bin/createlogin" onsubmit="return validateForm(this)">

score 0 · Accepted Answer

いくつかの構文エラーがあります。

この行を確認してください。"がその行にありません。行を変更します From,

var answ2=document.forms["newlogin"]["ans2].value;

に、

 var answ2=document.forms["newlogin"]["ans2"].value;

そして、==if文で条件を確認するために使用する必要があります。しかし、以下の行では、を 1 つしか使用していません=。から行を変更し、

if(answ1==null || answ1=="" || answ2=null || answ2=="") {
        alert("Enter Answer 1 & Answer 2.");
        return false;
    }

に、

if(answ1==null || answ1=="" || answ2==null || answ2=="") {
        alert("Enter Answer 1 & Answer 2.");
        return false;
}

提案: firebug または javascript エラーコンソールを使用して、これらのエラーを見つけてください。

javascript - onsubmit が JavaScript 関数に失敗しています

4 に答える 4

Related

Reference