0

モーダルを使用してログインボックス(bootstrap-modal.js)を表示するページで、twitter ブートストラップ css フレームワークを使用しています。ログイン ボックスでは、電子メール ID とパスワードを検証するために jquery の非常に単純な検証 (jquery.rsv.js) を使用しています。問題は、検証が IE 9 のログイン モーダル ボックス内で機能しないことです。同じページにモーダルではない別のフォームがあり、検証は完全に正常に機能します。

以下は私のブートストラップモーダルフォームコードです:-

<div id="modal-from-login" class="modal hide fade">
            <div class="modal-header">
              <a href="#" class="close">&times;</a>
              <h3>Login for existing customers</h3>
            </div>
            <div class="modal-body">

    <form id="loginform" name="loginform" method="post" action="login/">

        <div class="clearfix"><label for="comments">Email ID:</label>
            <input type="text" name="email" id="loginemail" /></div>
        <div class="clearfix"><label for="comments">Password:</label>
            <input type="password" name="password" id="loginpassword" />
    </div>
        </div>

    <div class="modal-footer">
        <input type="submit" style="float:left;margin-left:130px;" name="login" id="login" value="Login" class="btn primary" />
    </div>

</form>
    </div>


これはボタンコードです:-

<button class="btn primary" data-controls-modal="modal-from-login" data-backdrop="true" data-keyboard="true" style="margin-top:5px;">Login</button>

検証用の JavaScript コード:-

    
    function my_custom_function()
        {

if (document.getElementById("website").value){ var url = document.getElementById("website").value; var test = /^(https?|ftp):\/\/(((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:)*@)?(((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?)(:\d*)?)(\/((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)?(\?((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(\#((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/i.test(url); var field = document.getElementById("website"); if(test){ return true; }else{ return [[field, "Please enter a valid website."]]; } }else{ return true; } } $(document).ready(function() { function loginComplete(){ return true; } $("#loginform").RSV({ onCompleteHandler: loginComplete, rules: [ "required,loginemail,Please enter your email id.", "valid_email,loginemail,Please enter a valid email address.", "required,loginpassword,Please enter your password." ] }); }); </script>

jquery 1.4.2を使用しています

何が問題ですか??このコードは、IE8 でも他のすべてのブラウザーで問題なく動作します。この問題は IE 9 でのみ発生します。

4

1 に答える 1

1

あなたのコード規則はひどく、読者を夢中にさせます。

  1. 私の最初の提案は、あなた自身が常にあなたのコードの読者であることです。あなた自身の便宜のために、コードをフォーマットしてください(インデント、命名規則など)。そしてSynchroに同意しました.jQueryでは、次を使用することをお勧めします。

    $("#form_id")

    それ以外の:

    document.getElementById("form_id")

  2. 私の 2 番目の提案: 問題をより明確にします。「問題は、IE 9 のログイン モーダル ボックス内で検証が機能しないことです」。うまくいかないケースが多いです。JSエラーはありますか?または、フィールド検証なしでフォームが正常に送信されましたか? IE9 の開発者ツールのコンソールに注目していましたか? フォームの送信時にエラー メッセージが表示されましたか?

  3. 私の 3 番目の質問: 「my_custom_function()」という名前のカスタム関数を定義しているのを見ましたが、使用していません。あなたのコードを見てください:

    次のコード行を配列に挿入する必要があります。

    rules: [ // その他の検証ルール... "function,my_custom_function" ]

于 2012-01-07T23:36:08.520 に答える