登录功能没有';我不在firefox工作,但在chrome、IE、safari和opera上工作


login function doesn't work in firefox but works on chrome,IE,safari and opera

我使用jquery登录了我的后端网页。

这是表格:

<form method="post" action="#" autocomplete='off'>
    <h1 class="white-text">ADMIN Log in</h1>
    <div class="row"><div id="errMsg"></div></div>
    <div class="row">
        <div class="large-12"><input type="text" placeholder="User ID" name="txtUsername" id="txtUsername"></div>
    </div>
    <div class="row">
        <div class="large-12"><input type="password" placeholder="Password" name="txtPassword" id="txtPassword"></div>
    </div>
    <div class="row">
        <div class="large-12 columns">
            <p><a href="#"  data-reveal-id="myModal">Need Help Signing in?</a></p>
        </div>
    </div>
    <div class="large-12 columns ">
        <input type="submit" value="Sign In" class="button right" onclick="validLogin()"> 
    </div>                
</form>

这是处理登录的jQuery:

function validLogin(){
      var username=$('#txtUsername').val();
      var password=$('#txtPassword').val();
      var dataString = 'username='+ username + '&password='+ password;
      $("#errMsg").hide();
      $.ajax({
      type: "POST",
      url: "processed.php",
      data: dataString,
      cache: false,
      success: function(result){
               var result=trim(result);
               if(result=='admin'){
                     window.location='admin.php';
               }else if(result=='Invalid ID or password!') {
                     $("#errMsg").show(100);                           
                     $("#errMsg").html("LOGIN FAILED!: " + result);                           
               }else{
                      $("#errMsg").fadeIn(100);                              
                      $("#errMsg").html(result);                            
               }
      }
      });
}

这是来自jquery的url的php文件:

<?php
session_start();
include('include/connection.php');
$message=array();
if(isset($_POST['username']) && !empty($_POST['username'])){
    $username=$_POST['username'];
}else{
    $message[]='<i class="foundicon-error"></i> username';
}
if(isset($_POST['password']) && !empty($_POST['password'])){
    $password=stripslashes($_POST['password']);
}else{
    $message[]='<i class="foundicon-error"></i> password';
}
$countError=count($message);
if($countError > 0){
    echo "Please enter your ";
     for($i=0;$i<$countError;$i++){
                if ($i > 0){ 
                    $con=" and "; 
                }else { 
                    $con=""; 
                }
              echo $con.$message[$i];
     }
}else{
    $query="select * from admin_users where username='$username' and password='$password'";
    $res = mysqli_query($connect,$query);
    while($row = mysqli_fetch_assoc($res))
        {
            $userlvl = $row['user_level'];
        }
    $checkUser=mysqli_num_rows($res);
    if($checkUser > 0){
         $_SESSION['LOGIN_STATUS']=true;
         $_SESSION['uname']=$username;
         if ($userlvl == 1) {
            echo 'admin';
         }
         else {
            echo 'techadmin';
         }
    }else{
        echo "Invalid ID or password!";
    }
}
?>

我不知道为什么这些代码在firefox上不起作用,但它在chrome、IE、opera和safari上完美工作。。

它不会转到它要去的页面。。。它只是停留在登录页面上。。。没有返回错误或任何错误。。。而且,控制台中没有错误日志

function validLogin(){
   event.preventDefault();
   ^

事件未定义,导致javascript中止。

还可以检查开发人员控制台、F12键,或者为Firefox安装插件FireBug,看看控制台上写着什么。

编辑

您确定jQuery已启用吗?你能发布一个完整场景的jsfiddle吗?

检查控制台以查看javascript错误,也许您在某个地方有解析错误,开发人员控制台会有所帮助。

EDIT2

更改

<form method="post" onsubmit="return validLogin();" action="#" autocomplete='off'>
     .....
    <div class="large-12 columns ">
        <input type="submit" value="Sign In" class="button right">
    </div>
</form>

和Js到:

function validLogin(){
      var username=$('#tx....
      .....
      .....
      return false;  // at the end
}

jsfiddle:http://jsfiddle.net/9kcx9/

这应该可以解决您的问题。首先给form一个id:

<form method="post" action="#" autocomplete="off" id="myform">
    <h1 class="white-text">ADMIN Log in</h1>
    <div class="row"><div id="errMsg"></div></div>
    <div class="row">
        <div class="large-12"><input type="text" placeholder="User ID" name="txtUsername" id="txtUsername"></div>
    </div>
    <div class="row">
        <div class="large-12"><input type="password" placeholder="Password" name="txtPassword" id="txtPassword"></div>
    </div>
    <div class="row">
        <div class="large-12 columns">
            <p><a href="#"  data-reveal-id="myModal">Need Help Signing in?</a></p>
        </div>
    </div>
    <div class="large-12 columns ">
        <input type="submit" value="Sign In" class="button right"> 
    </div>                
</form>

validLogin将传递一个Event,使用evt作为参数捕获它,使用evt.preventDefault( )return false;(在末尾(来阻止默认的提交操作。获取表单元素并设置onsubmit=validLogin

function validLogin(evt){
      evt.preventDefault( );
      var username=$('#txtUsername').val();
      var password=$('#txtPassword').val();
      var dataString = 'username='+ username + '&password='+ password;
      $("#errMsg").hide();
      $.ajax({
      type: "POST",
      url: "processed.php",
      data: dataString,
      cache: false,
      success: function(result){
               var result=trim(result);
               if(result=='admin'){
                     window.location='admin.php';
               }else if(result=='Invalid ID or password!') {
                     $("#errMsg").show(100);                           
                     $("#errMsg").html("LOGIN FAILED!: " + result);                           
               }else{
                      $("#errMsg").fadeIn(100);                              
                      $("#errMsg").html(result);                            
               }
      }
      });
      return false;
}
document.getElementById("myform").onsubmit = validLogin;

在这里测试,在firefox和chrome中工作(打开jsbin控制台查看其工作情况(