提交在JQuery Post的同一页面上返回空

Question

我正在尝试使用JQuery帖子创建帖子页面，但是由于某些原因，当我按下发布按钮时，它会将我重定向到同一页面，并且什么也不做。 我不知道我在这里想念什么。

我想要的是，当它登录时，它把我带到了另一个logged-in.php页面logged-in.php 。

页

<form class="form-2" action="./" method='post' autocomplete="off">
        <h1><span class="log-in" style="font-size: 20px; margin-bottom: 25px;">Log in</span><span class="inner"></span></h1><br>
        <p class="float">
          <label for="username"> <i class="icon-fixed-width icon-user" style="font-size:15px;"></i>Username</label>
            <input type="text" name="username" placeholder="Username or email" id="email" >
        </p>
        <p class="float">
            <label for="password"><i class="icon-lock" style="font-size: 15px;"></i>Password</label>
            <input type="password" name="password" placeholder="Password" class="showpassword" id="passwd"> 
        </p><br>
        <br>

        <p class="clearfix">    
            <div class="register">Don't have credentials? Please <a href="./register.php">Register</a>.
                <input type="submit" onclick="users_login();" name="submit" value="Submit">
            </div> 
        </p>       
    </form>
    <div class="_fields" align="left" id="login_status"></div><br clear="all">

JS（users_login（））

   function users_login() 
   {

var vpb_email = $("#email").val();
var vpb_passwd = $("#passwd").val();


if(vpb_email == "")
{
    $("#login_status").html('<div class="info">Please enter your account email address to proceed.</div>');
    $("#email").focus();
}
else if(vpb_passwd == "")
{
    $("#login_status").html('<div class="info">Please enter your account password to go.</div>');
    $("#passwd").focus();
}
else
{
    alert("Inside the Ajax Validator: " + vpb_email  + " Password " + vpb_passwd);
    var dataString = 'email=' + vpb_email + '&passwd=' + vpb_passwd + '&page=users_login';
    $.ajax({
        type: "POST",
        url: "save_details.php",
        data: dataString,
        cache: false,
        beforeSend: function() 
        {

            $("#login_status").html('<br clear="all"><br clear="all"><div align="left"><font style="font-family:Verdana, Geneva, sans-serif; font-size:15px; color:black;">Please wait</font> <img src="images/loadings.gif" alt="Loading...." align="absmiddle" title="Loading...."/></div><br clear="all">');
        }, 
        complete: function(){ 

        },
        success: function(response)
        {

            var response_brought = response.indexOf('login_process_completed_successfully=yes');
            if (response_brought != -1) 
            {

                $("#login_status").html('');
                window.location.replace(response);
            }
            else
            {

                $("#login_status").fadeIn(1000).html(response);
            }
        }
    });
}
  }

PHP（save_details.php）

$user_email = trim(strip_tags($_POST['email']));
        $user_password = trim(strip_tags($_POST['passwd']));
        $encrypted_md5_password = md5($user_password);

        $validate_user_information = mysql_query("select * from `signup_and_login_table` where `email` = '".mysql_real_escape_string($user_email)."' and `password` = '".mysql_real_escape_string($encrypted_md5_password)."'");

        if(mysql_num_rows($validate_user_information) == 1)
        {
            $get_user_information = mysql_fetch_array($validate_user_information);
            $_SESSION["VALID_USER_ID"] = $user_email;
            $_SESSION["USER_FULLNAME"] = strip_tags($get_user_information["firstname"].' '.$get_user_information["lastname"]);
            echo 'index.php?uid='.$_SESSION["USER_FULLNAME"].'&';
            echo 'login_process_completed_successfully=yes';
        }
        else
        {
            echo '<br><div class="info">Sorry, you have provided incorrect information. Please enter correct user information to proceed. Thanks.</div><br>';
        }

谢谢。

Answer 1

当您按下Submit按钮时，将自动提交表单，从而导致页面的重新加载，因为需要重新加载页面才能发送数据-因此，无法运行javascript。 为避免这种现象，请执行以下操作：

<form class="form-2" action="./" method='post' autocomplete="off" onclick="event.preventDefault();">

这应该对您有帮助。