0

以下の ajax は、chrome、IE、opera、safari で完全に動作します。しかし、どういうわけかfirefoxでは機能しません。参照エラーと表示され、イベントが定義されていません。return false の代わりに event.preventDefault() を使用してみましたが、確かに運が悪いです。送信ボタンをクリックすると、firefox ではページが loginCheck.php にジャンプし、成功を示します。しかし、それは私が意図した方法ではありません。メッセージ「成功」は、別のページにジャンプして別のページにメッセージを表示するのではなく、同じページ自体に返される必要があります。

フォームは次のとおりです。

<form id="loginForm" class="ajax" action="ajax/loginCheck.php" style="padding-left: 10px;" method="post">

Username: <br/>
<input name="username" class="required" type="text"> <br/> 

<span class="small">
<a class="mouseOver forgot" href="include/recover.php?mode=u_name">Forget username ?</a>
</span><br/>

Password: </br>
<input name="password" class="required" type="password"> <br/>
<span class="small">
<a class="mouseOver forgot" href="include/recover.php?mode=u_password">Forget password ?</a>
</span><br/>

<input type="submit" class="button" value="sign in">

    //when login button is clicked
(function(){

    $('form.ajax').on('submit' , function(){
    //alert('about to pass data');
    var that = $(this),
        url = that.attr('action'),
        type = that.attr('method'),
        data = {};  //declaration of data of array type

    that.find('[name]').each(function(index, value){
        var that = $(this),
            name = that.attr('name'),
            value = that.val();

        data[name] = value;
    });

    $.ajax({
        url: url,
        type: type,
        data: data,

        success: function(response){    //code to run if request success

            var result = $.trim(response);
            console.log(response);
            if(result == "success"){
                $('#interaction').load('interaction.php'); //load logout icong
                $('#rightbar').load('rightbar.php');    //load user panel
                $('.loginCheck').html("");
            }else{
                $('.loginError').show();
                $('.loginError').html(response);
            }
        }
    });

        return false;
    });

})();
4

1 に答える 1

0

最初の変更

<input type="submit" class="button" value="sign in">

に:

<input id='btn_login' type="button" class="button" value="sign in">

次に、次の JavaScript を使用します。

//when login button is clicked
(function(){

$('#btn_login').on('click' , function(){
    //alert('about to pass data');
    var that = $('#loginForm'),
    url = 'ajax/loginCheck.php';
    type = 'post';
    data = {};  //declaration of data of array type

    that.find('[name]').each(function(index, value){
        var that = $(this),
        name = that.attr('name'),
        value = that.val();

        data[name] = value;
    }); 

    $.ajax({
        url: url,
        type: type,
        data: data,

        success: function(response){    //code to run if request success

            var result = $.trim(response);
            console.log(response);
            if(result == "success"){
                $('#interaction').load('interaction.php'); //load logout icong
                $('#rightbar').load('rightbar.php');    //load user panel
                $('.loginCheck').html("");
            }else{
                $('.loginError').show();
                $('.loginError').html(response);
            }   
        }   
    }); 

    return false;
  }); 

  })();
  </script>
于 2013-07-10T03:46:57.520 に答える