2

私は最終的に、他のブラウザで自分のサイトをテストするところまで来ました (ほとんどが Chrome で構築されています)。残念ながら、多くのものが異なって機能するようです。最初の問題から始めましょう。ログイン時に、ユーザー名とパスワードが一致することを確認するために JS/jQuery チェックがあり、失敗すると送信が停止するはずです。

ただし、Chrome と Safari では機能しますが、Mozilla と IE ではまだ提出が進行中です (謝罪ページにアクセスしていますが、それでもまったく見たくないものです)。

orevent.preventDefault()をサブスクライブしようとしましたが、どれも機能せず、フォームは引き続き送信されます (2 番目の 2 つは、Chrome でも送信されるようにします)。これが私のコードです。e.preventDefault()evt.preventDefault()

function checkLogin()
{
    // get the variables, execute some other checks (eg, things not blank)

    // run ajax code to determine if pieces match
    $.ajax({
    type: "POST",
    url: "check_login.php", 
    data: {'username': username, 'password': password},
    async: false,
    success: function(result) 
    {
      if (result == 1)
      {
        $('#loginoff').html("Invalid username/password");
        e.preventDefault();
        return false;
      } 
      else
      {
        $('#loginoff').html("");
        return true;
      } 
    }
    });
}

ユーザー名とパスワードが一致しない場合、常に「無効なユーザー名/パスワード」メッセージが表示されるため、関数は確実に実行され、1 が返されることに注意してください。

また、誰かが HTML に興味を持っている場合:

<form action="login.php" method="post" onsubmit="return checkLogin()">
<!-- code for inputs, eg username -->
<input type="submit" class="btn" value="Log In"/>
</form>
4

5 に答える 5

6

最初にイベントを防止することをお勧めします。フォームを送信する場合は、jQuery をバイパスするため、ネイティブの送信メソッドを使用して送信します。

var form = document.getElementById("formid");
$(form).submit(function(e){
    e.preventDefault();

    $.ajax({
        type: "POST",
        url: "check_login.php",
        data: {
            'username': username,
            'password': password
        },
        //async: false,
        success: function (result) {
            if (result == 1) {
                $('#loginoff').html("Invalid username/password");
            } else {
                $('#loginoff').html("");
                form.submit(); // note, form is a form NODE, not a jQuery object containing a form.
            }
        }
    });

});

これにより、常に良いことを削除することもできますasync: false(webworkers 内以外で)。

于 2013-01-23T18:21:41.847 に答える
2

console.log を保持するようにコンソールを設定します。JavaScript エラーが表示されるはずです

e.preventDefault();  //<--trying to prevent the form from submitting

どこでe定義されていますか？

function checkLogin()  <-- No e defined

停止を妨げるものがないため、フォームが送信されることを意味するエラーが発生します。

function checkLogin(e) {
    e = e || window.event;

jQueryでラップされたイベントオブジェクトではないため、次のようにする必要があります

$.Event(e).preventDefault();
于 2013-01-23T18:59:25.167 に答える
0

残念ながら、4 つのブラウザーすべてで送信をうまく防ぐことができなかったため、タイトルで望んでいたようにすることができませんでした (Mozilla は永続的なホールドアウトでした)。

その結果、私がやったことは次のとおりです。

1.) HTML で、入力のみが含まれるように境界を変更しましたが、[送信] ボタンは外側にありました

2.) 次に、「return checkLogin()」を送信ボタン (現在はフォームの外) に移動し、「onclick」に変更しました。

3.) この方法では、デフォルトが発生しないため、 preventDefault() は必要ありませんでした。私は単純に ajax リクエストに行き、「true を返す」場合は $('#mainform').submit(); を実行するように設定しました。

注：これを行うことで、ajaxリクエストを非同期にすることもできました。これは誰もが良いことだと言っています（私はまだ新しいので、その重要性については確信が持てません）。

うまくいけば、これは同じ問題に遭遇した人に役立ちます.

于 2013-01-23T19:58:59.613 に答える
0

他の人が言及した ajax の問題に加えて、IE8 は preventDefault() を行いません。

IE8 の PreventDefault 代替

(event.preventDefault) ? event.preventDefault() : event.returnValue = false;
于 2013-01-23T18:15:04.627 に答える
0

私は最終的にそれを一般的に機能させる方法を見つけました：

セクションでは、関数は次のように記述する必要があります。

checkLogin の入力として「イベント」に注意してください

次に、私が使用した機能は以下のとおりです。主な変更点は、a.) 開始時のデフォルトの送信を防止する ($.Event(e) が必要であることに注意してください。そうしないと IE では機能しません)、b.) getElementById を使用してフォームを定義する、c.) 関数を送信するform.submit() を使用します。うまくいけば、人々はこれが役に立ちます。

function checkLogin(e)
{
var form = document.getElementById("mainloginform");
$.Event(e).preventDefault();

// set error counter
var counter = 0;
var username = $('#loginusername').val();
var password = $('#loginpassword').val();

// check that username is not blank
 if (username==null || username=="")
{
    $('#usernameoff').html("Must enter your username");
    counter++;
}
else
{
    $('#usernameoff').html("");
}

// check that password is not blank
 if (password==null || password=="")
{
    $('#passwordoff').html("Must enter your password");
    counter++;
}
else
{
    $('#passwordoff').html("");
}

// if counter zero at this point, return false, else return true
if (counter > 0)
{
    return false;
}
else
{
    $.post("check_login.php", {'username': username, 'password': password}, function(result)
    {
        if(result == 1)
        {
            $('#loginoff').html("Invalid username/password");
            return false;
        }
        else
        {
            $('#loginoff').html("");
            form.submit();
            return true;
        }
    });
}
}
于 2013-01-23T22:14:25.750 に答える