0

具体的には、情報が含まれているはずの空のフォームを送信すると、「値を入力してください」というアラートを送信する必要がありますが、アラートで[OK]を選択した後も、送信時にメールが送信されます。エラーが発生した場合は、送信時の電子メールを送信する前に、フォームの要件を満たしている必要があります。コードは次のとおりです。

これは、フィールドに値があるかどうかを確認します

function notEmpty(elem, helperMsg) {
    if (elem.value.length >= 2) {
        return true;
        alert(helperMsg);
        elem.focus();
        return false;
    }
    return true;
}

フォームの開始：

<form method="get" onsubmit="notEmpty();" action="http://www.censoredgaming.co.uk/cgi-bin/mailer.pl">

送信ボタン：

<input type="submit" name='Submit' value="Send" onClick='notEmpty();'>

私たちの問題への洞察は大歓迎です！

4

2 に答える 2

3

これが失敗する理由はいくつかあります。

最初に遭遇するのは、を呼び出すときに引数を渡さないためnotEmpty、変数elemはになりますundefined。プロパティ（）にアクセスしようとするとvalue、例外がスローされ、関数が停止します。

これを上から見ていきましょう。

まず、より新しい方法を使用してイベントハンドラーを適用します。

処理するフォームを識別する手段を提供します。id属性は一般的な選択として適切です（ただし、私よりも意味のある名前を使用してください）。

<form id="myForm"
      method="get"
      action="http://www.censoredgaming.co.uk/cgi-bin/mailer.pl">

次に、DOM内のフォームへの参照を取得し、それにイベントリスナーを追加します。

document.getElementById('myForm').addEventListener('submit', notEmpty);

フォームがDOMに追加された後で、これを行う必要があることに注意してください。これを実現する最も簡単な方法は、<script>後を配置することです</form>（直前</body>が人気の場所です）。DOMの準備ができたとき、またはドキュメントがロードされたときに起動するイベントハンドラーを使用することもできます。

古いバージョンのInternetExplorerはサポートしていません。サポートaddEventListernerしたい場合は、互換性ルーチンがあるMDNドキュメントを参照してください。

次に、notEmpty関数を更新します。これはイベントハンドラーであるため、1つの引数（イベントオブジェクト）を取得します。また、バインドされている要素（フォーム）のコンテキストで呼び出されます。

function notEmpty(event) {
    var aForm = this;
}

ある要素が特定の長さの値を持っていることを確認したいのですが、質問にそのような要素の兆候はありません。この例で作業してみましょう：

<label> Some data <input name="example"></label>

フォームの要素コレクションから要素を参照できます。

function notEmpty(event) {
    var aForm = this;
    var input = aForm.elements.example;
}

これで、テストを追加できます。

function notEmpty(event) {
    var aForm = this;
    var input = aForm.elements.example;
    if (input.length >= 2) {

    } else {

    }
}

フォームを送信したくない場合は、イベントに対するデフォルトのアクションを禁止します。

function notEmpty(event) {
    var aForm = this;
    var input = aForm.elements.example;
    if (input.length >= 2) {
        // At least two characters, all is well
    } else {
       alert("An error");
       input.focus();
       event.preventDefault();
    }
}
于 2013-03-22T21:41:57.783 に答える
0

あなたの最初のreturn trueものを削除する必要があります：P

于 2013-03-22T21:38:58.907 に答える