1

次のJSコードがあります：

function checkFull(id) {
    var input = $('#' + id).val();  
    if (input == "") {
        return false;   
    }
    else {
        return true;
    }
}

function checkSame(id1,id2) {
    var input1 = $('#' + id1).val();    
    var input2 = $('#' + id2).val();
    if (input1 == input2) {
        return true;
    }
    else {
        return false;
    }
}
function showErrors() {
    if (!checkFull('username')) {
        $('#userfield').show(); 
    }
    else {
        $('#userfield').hide(); 
    }

    if (!checkFull('email')) {
        $('#notsame').show();   
    }
    else {
        $('#notsame').hide();   
    }

    if (!checkFull('confemail')) {
        $('#notsame2').show();  
    }
    else {
        $('#notsame2').hide();  
    }

    if (!checkFull('espncode')) {
        $('#nocode').show();    
    }
    else {
        $('#nocode').hide();    
    }

    if (notSame('email','confemail')) {
        $('#notsame2').show();
        $('#notsame').show();   
    }
    else {
        $('#notsame2').hide();  
        $('#notsame').hide();
    }
}
function valform() {
    showErrors();
    if (checkFull('username') && checkFull('email') && checkFull('confemail') && checkSame('email','confemail') && checkFull('espncode')) {
        form.submit();
        alert('success');
    }
    else {

        return false;
    }
}

そして、次のフォーム：

<form method="post" action="forms/post.asp" onsubmit="valform();return false">
            <strong>Poker Username</strong> <span id="userfield" style="display:none;color:#F00">*</span><br />
            <input type="text" name="username" id="username" style="width:230px;" />
            <br /><br />
            <div class="vert">
                <strong>Email Address</strong> <span id="notsame" style="display:none;color:#F00">*</span><br />
                <input type="text" name="email" id="email" style="width:230px;" />
            </div>
            <div class="vert2">
                <strong>Confirm Email Address</strong> <span id="notsame2" style="display:none;color:#F00">*</span><br />
                <input type="text" name="confemail" id="confemail" style="width:230px;" />
            </div>
            <div style="clear:both;"></div>
            <div class="espn">
                <div class="txt"><strong>Enter the ESPN special code</strong></div>
                <input type="text" name="espncode" id="espncode" style="width:230px;" />
            </div>
            <div id="nocode" style="display:none">
                You need to enter the code above
            </div>
            <div class="tc">
                <input type="checkbox" id="agree" name="agree" /> <strong>You agree to the terms and conditions of this sweepstake. Only one entry per person per sweepstake period. Any additional entries will be disqualified.</strong>
            </div>
            <br />
            <div class="submit">
                <input type="image" src="submit_BTN.png" />
            </div>
        </form>

フォームを空白のままにしても、送信を押すと送信されます。何故ですか？

4

2 に答える 2

3

submitハンドラー内の検証関数から値を返す必要があります。

onsubmit="valform();return false"

次のようにする必要があります。

onsubmit="return valform();"

false を返すたびvalformに、フォームの送信が妨げられます。

ところで、関数form.submit()内の呼び出しは意味がありません。valform関数が false を返さない場合でも送信されます。

if (/*validity checks pass*/) {
    alert('success');
}
else {
    return false;
}

しかし、このフィドルでコードを調べると、エラーがあることに気付きました:

ReferenceError: 変数が見つかりません: notSame

関数の名前を修正すると、機能します。このような小さなバグをデバッグするには、利用可能な開発者ツールを使用する必要があります。Firefox 用の Firebug と Chrome/Safari には Web インスペクタが組み込まれています。Opera には Dragonfly もあります。

于 2012-08-09T08:34:22.707 に答える
1

考えられる原因:

  • onsubmit="valform();return false"フォームに変更しonsubmit="valform();"ます。

それでもうまくいかない場合は試してください。

于 2012-08-09T08:41:49.247 に答える