1

これは本当に私をループに投げ込んでいます。関数がグローバル変数内にあるonsubmit="return validateForm()"ときに呼び出すことで、このフォームをJavaScriptで正常に検証できました。validateForm残念ながら、IE8のデバッグを開始すると、グローバル変数があるためにエラーが発生し続け、代わりにグローバル関数にすることにしました...

今、私はそれをまったくトリガーさせることができないようです。-_-

（そして、ええ、私は実際にテストで接頭辞を付けて、グローバルであるために競合していないことを確認しました。）

私の知る限り、私は基本的な形の縮図をやっています。この方法はw3schoolsに示されている方法であり、それらに対して機能するので、...何が得られますか？

私のフォーム：

<form name="emailus" id="emailus" action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post" onsubmit="return validateForm()">
    <a href="mailto:example@email.com">
        <h3><i class="icon-envelope-alt icon-large"></i>Send us an email<span>: example@email.com</span></h3>
    </a>

    <div class="half">
        <fieldset class="name">
            <label for="cf_name">Name <span>*</span></label>
            <input type="text" id="cf_name" name="cf_name" class="textualformfield" placeholder="Jane Doe" pattern="^[a-zA-Z'\s]+$">
        </fieldset>
        <fieldset class="emailaddress">
            <label for="cf_email">E-mail <span>*</span></label>
            <input type="text" id="cf_email" name="cf_email" class="textualformfield" placeholder="janedoe@email.com" pattern="[a-z0-9!#$%\x26'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%\x26'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+(?:[A-Z]{2}|com|org|net|edu|gov|mil|biz|info|mobi|name|aero|asia|jobs|museum)\b">
        </fieldset>
        <fieldset class="phonenumber">
            <label for="cf_phonenumber">Phone</label>
            <input type="tel" id="cf_phonenumber" name="cf_phonenumber" class="textualformfield" placeholder="555-555-5555">
        </fieldset>
        <fieldset class="eventdate">
            <label for="cf_eventdate">Event Date</label>
            <input type="text" id="cf_eventdate" name="cf_eventdate" class="textualformfield" placeholder="May 25th, 2012">
        </fieldset>
        <fieldset class="location">
            <label for="cf_location">Location</label>
            <input type="text" id="cf_location" name="cf_location" class="textualformfield" placeholder="The Church">
        </fieldset>
    </div>

    <div class="half">
        <textarea name="cf_message" class="textualformfield" placeholder="Your Message"></textarea>
    </div>

    <input type="submit" name="submit" id="submit" value="Submit">
</form>

私のjavascript関数は、外部に配置(document).readyされているため、呼び出すことができます。

function validateForm() {
    window.alert("I'm activating!");
    var valid = true;

    jQuery('p.validationhelpers').remove();

    if (document.emailus.cf_email.value === '') {
        jQuery('.emailaddress').append("<p class='validationhelpers'>Please enter an email address.</p>");
        jQuery('.emailaddress>input').focus();
        valid = false;
    }

    if (document.emailus.cf_name.value === '') {
        jQuery('.name').append("<p class='validationhelpers'>Please enter your name.</p>");
        jQuery('.name>input').focus();
        valid = false;
    }

    return valid;
}

代わりに、それはただ提出するだけです...私はこれがばかげた問題であるように感じます。onsubmitのコンテンツをreturn validateForm();、return false; return validateForm()（実際にはfalseを返し、送信できませんでした）、、、およびにreturn validateForm(); return false();置き換えvalidateForm()てみましたvalidateForm();。

> _ <

解決策： bjornarvhは、実際のサイトのデバッグから本当の原因を見つけました。本当の答えは解決済みとしてマークされた答えのコメント内にあるので、ここでそれを強調しています。

javascriptの関数の1つに閉じ括弧がないことが判明しました。これにより、validateForm関数が内にラップされ(document).ready、にアクセスできなくなりましたonsubmit。偶発的なスコープの問題！

4

1 に答える 1

2

JavaScriptでは大文字と小文字が区別されるため、追加する必要があります

onsubmit="return ValidateForm()"

それ以外の

onsubmit="return validateForm()"
于 2013-03-27T09:24:35.787 に答える