Question

下面的ajax完美地用于chrome，IE，opera和safari。但它是，不知何故不在Firefox中工作。它表示引用错误，事件未定义。我尝试使用event.preventDefault（）而不是返回false，对我来说肯定没有运气。单击提交按钮时，在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;
    });

})();

Answer 1

首先改变

<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>

ajax不使用firefox，但完全可以与其他浏览器一起使用。错误日志说：未定义ReferenceError事件

1 个答案: