Javascript AJAX PHP登录页未正确重定向_Javascript_Php_Jquery_Html_Ajax

Javascript AJAX PHP登录页未正确重定向

javascript php jquery html ajax

Javascript AJAX PHP登录页未正确重定向,javascript,php,jquery,html,ajax,Javascript,Php,Jquery,Html,Ajax,基本上，我有一个AJAX登录页面，可以正常工作，但当我成功登录时，我希望它重定向到一个页面，而无需重新加载，我不知道它是如何完成的，因为我对langauge非常陌生。非常感谢 index.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http:

基本上，我有一个AJAX登录页面，可以正常工作，但当我成功登录时，我希望它重定向到一个页面，而无需重新加载，我不知道它是如何完成的，因为我对langauge非常陌生。非常感谢

index.php
   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="jquery.js"></script>
<link rel="stylesheet" href="styles.css" type="text/css" />
<title>Popup Login</title>
<script type="text/javascript">
$(document).ready(function(){
    $("#login_a").click(function(){
        $("#shadow").fadeIn("normal");
         $("#login_form").fadeIn("normal");
         $("#user_name").focus();
    });
    $("#cancel_hide").click(function(){
        $("#login_form").fadeOut("normal");
        $("#shadow").fadeOut();
   });
   $("#login").click(function(){

        username=$("#user_name").val();
        password=$("#password").val();
         $.ajax({
            type: "POST",
            url: "login.php",
            data: "name="+username+"&pwd="+password,
            success: function(html){
              if(html=='1')
              {
                $("#login_form").fadeOut("normal");
                $("#shadow").fadeOut();
                $("#profile").html("<a href='logout.php' id='logout'>Logout</a>");

              }
              else
              {
                    $("#add_err").html("Wrong username or password");
              }
            },
            beforeSend:function()
            {
                 $("#add_err").html("Loading...")
            }
        });
         return false;
    });
});
</script>
</head>
<body>
<?php session_start(); ?>
    <div id="profile">
        <?php if(isset($_SESSION['user_name'])){
            ?>
            <a href='logout.php' id='logout'>Logout</a>
        <?php }else {?>
        <a id="login_a" href="#">login</a>
        <?php } ?>
    </div>
    <div id="login_form">
        <div class="err" id="add_err"></div>
        <form action="login.php">
            <label>User Name:</label>
            <input type="text" id="user_name" name="user_name" />
            <label>Password:</label>
            <input type="password" id="password" name="password" />
            <label></label><br/>
            <input type="submit" id="login" value="Login" />
            <input type="button" id="cancel_hide" value="Cancel" />
        </form>
    </div>
    <div id="shadow" class="popup"></div>
</body>
</html>

    <?php
 session_start();
 $username = $_POST['name'];
 $password = $_POST['pwd'];
 $mysqli=mysqli_connect('');
 $query = "SELECT * FROM user WHERE username='$username' AND password='$password'";
 $result = mysqli_query($mysqli,$query)or die(mysqli_error());
 $num_row = mysqli_num_rows($result);
 $row=mysqli_fetch_array($result);
 if( $num_row >=1 ) {
  echo '1';
  $_SESSION['user_name']=$row['username'];
 }
 else{
 echo 'false';
 }
?>

当我成功登录时，我希望它重定向到一个页面，而无需重新加载

只要要重定向到的页面位于同一个域中，或者您可以正确设置CORS标题，并且可以处理相关链接，那么在成功回调中，您可以用新页面的HTML替换整个页面的HTML

您可以为新页面启动另一个ajax调用，并使用document.write删除现有HTML，如下所示：

...
success: function(html){
    if(html=='1') {
        $("#login_form").fadeOut("normal");
        $("#shadow").fadeOut(400, function(){

            // Completely replace the page's HTML
            $.ajax({
                type: 'GET',
                url: 'http://example.com/logged-in',
                async: false, // You want this synchronous
                success: function(data) {

                  // This code block replaces your current page seamlessly
                  document.open();
                  document.write(data);
                  document.close();

                },
                error: function(e){
                   alert(e.message);
                }
            });
        });
    }
    ...

下面是一个演示：

$bye.fadeout 1400，函数{ $.ajax{ 键入：“GET”，网址：'http://enable-cors.org/', async:false，成功：functiondata{ //这是一个快速而肮脏的黑客 //要获得演示的相关链接，请执行以下操作 var base_href=； document.open； document.writebase_href+数据；文件关闭； }, 错误：functione{ 警报e.message； } }; };

成功登录您的代码易受sql注入攻击，您应该使用mysqli_real_escape_字符串转义用户名和密码。ajax完成后，隐藏登录表单并使用另一个ajax加载登录的仪表板。最好从登录页面重定向到应用程序页面，并仅在应用程序中使用ajax。登录页面应该只包含足够的代码，允许用户登录，并可能提供忘记密码或支持链接。这样，未经授权的访问者就无法了解您的应用程序逻辑。如何隐藏登录表单？你建议什么时候使用ajax@madalinivascutry window.location.replace/！！！