2

現在、無効な電子メールが入力されたときにエラーメッセージを表示するように連絡フォームをセットアップしようとしています。空白または間違った電子メールが送信された場合、ページは次のことを行う必要があります。

  • サインアップ テキストが「再試行」に変更
  • 入力フィールド内に「入力された住所が無効です」という赤いテキストが表示される

ユーザーが入力フィールドにフォーカスしたとき、または「再試行」を押したとき。すべてのフォーム要素が元の状態に戻るはずです。onFocus メソッドを使用して、テキストを赤から黒に変更することができました。リセットという名前の小さな JavaScript を作成しようとしました。これは、DIV テキストを「再試行」から「サインアップ」に戻すことを望んでいました。

私の問題はJavascriptにあると確信しています。誰かが私を正しい方向に向けることができますか? :)

コード参照: http://itsmontoya.com/work/playdeadcult/indextest.php

4

3 に答える 3

0

代わりにこれを試してください：

function validate() {
    if($("#buttonDiv").html()== 'Retry')
    {
        // oops! They are trying to get back to where they were by 
        // re-clicking retry. Let's reset this thing
        reset()
        return false;
    }
    var emDiv = document.getElementById('email') // only look up once.
    if(emDiv) {
        // the space after the . should allow for 6 long
        var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,6})$/;
        var address = emDiv.value;
        // good form issue -- never use == false. use !
        if(!reg.test(address)) {
            emDiv.value = 'Address entered not valid';
            emDiv.style.color = '#bf4343';
            emDiv.style.fontSize = '12px';
            $("#buttonDiv").html( 'Retry' );
            return false;
        }
    }
}
于 2011-08-30T22:12:57.393 に答える
0

これを行う 1 つの方法は、html を使用することです。

<form action="" method="post">
    <fieldset>
        <label for="emailAddress">Sign up for the newsletter</label>
        <input type="text" id="emailAddress" name="email" />
        <button id="submitButton" type="submit">Submit</button>
    </fieldset>
</form>

そして JavaScript:

var emailEntry = document.getElementById('emailAddress');
var button = document.getElementById('submitButton');
var defaultButtonText = button.innerHTML;

emailEntry.onblur = function(){
    var val = this.value;

    // the following IS NOT a valid test of email address validity
    // it's for demo purposes ONLY

    if (val.length < 5 && val.indexOf('@') == -1){
        button.innerHTML = 'retry';
        button.style.color = 'red';
    }
    else {
        button.innerHTML = defaultButtonText;
        button.style.color = 'black';
    }
};

button.onclick = function(){
    // prevent submission of the form if the email was found invalid
    // and the innerHTML was therefore set to 'retry'
    if (this.innerHTML == 'retry'){
        return false;
    }
};

JS フィドルのデモ。

于 2011-08-30T22:09:49.927 に答える