Question

我正在使用Ajax（使用本机JavaScript）和php组合来构建登录。

来自一个php文件（login.php）。当它被提交时，它运行一个JS onlclick函数，它将表单数据发布到另一个验证表单数据的php文件中：

<input type="button" name="submit" value="Submit" onclick="JavaScript:xmlhttpPost('validator.php')"/>

validator.php的结果使用JavaScript在div中返回：

function updatepage(str){

document.getElementById("result").innerHTML = str;

}

最后，如果密码和用户名都正确，validator.php会运行如下的重定向：

if ( // form data is valid ) {

    header("Location: welcome.php");

}

但是，因为所有内容都是通过ajax运行的，所以会导致“welcome.php”页面显示在原始登录页面的“results”div中。

有没有办法通过JavaScript发送重定向？

Answer 1

您可以使用以下代码通过javascript重定向;

window.location.href = 'welcome.php';

当您进行ajax调用时，您无法通过服务器端应用程序重定向，如php。

您必须得到回复并在您的js中执行。

使用jQuery和PHP的Ajax请求示例。

将此代码放在您的前端（查看）：

<script type="text/javascript">
    $(document).ready(function(){
        $.ajax({
            url: 'your-php-file.php',
            dataType: 'html',
            success: function(response) {
                window.location.href = response;
            }
        });
    });
</script>

https://api.jquery.com/jQuery.ajax/

在你的php文件中，在你做了你想要的之后;回显路径或文件以重定向为响应。

<?php
    echo "file-or-path-to-redirect.php";

Answer 2

代替实际有效的答案，我找到了一个可行的解决方案。我不确定这是否是正确的方法，但效果很好。

在我的validator.php中，当表单值正确时，我提出以下内容：

if ( // form data is valid ) {

    echo 'redirect';

}

然后，在我的登录页面上，当从php页面返回字符串时，我把它放在：

function updatepage(str){

   if (str.match(/redirect/)) {
      window.location.replace('welcome.php');
   }
   else {
      document.getElementById("result").innerHTML = str;
   }
}

这个想法是，当validator.php确认登录凭证是正确的时，它会返回一个字符串。

如果该字符串与“redirect”匹配，JavaScript将重定向该页面。

如果有人对此有任何意见，请发表评论。我觉得这是一个非常好的解决方案。很惊讶我没想到它。

Answer 3

window.location.href='welcome.php';

或使用真实路径

window.location.href='http://www.yourdomain.com/welcome.php';

Answer 4

您可以使用窗口对象

window.location.href="http://example.com/welcome.php";

Answer 5

最简单的方法是使用json响应来模拟它。然后你解析json，看看你得到了什么样的回应。这是一个有效的例子：

<强>的index.html

<!DOCTYPE html>
<html>
<head>
<script>

function updatepage(str){

document.getElementById("result").innerHTML = str;

}


function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }

xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {

      var jsonParse = JSON.parse(xmlhttp.responseText);

      if(jsonParse.redirect){
        window.location.replace(jsonParse.redirect);
      }
      if(jsonParse.success){
        updatePage(success);
      }
    }
  }

xmlhttp.open("GET","login.php",true);
xmlhttp.send();
}
</script>
</head>
<body>

<div id="myDiv"><h2>Let AJAX change this text</h2></div>
<button type="button" onclick="loadXMLDoc()">Change Content</button>

</body>
</html>

<强>的login.php

<?php


// if($error)
echo json_encode(array('redirect'=>'welcome.php'));

//else
echo json_encode(array('success'=>'<div>logged in</div>'));

?>

从Ajax Call重定向PHP

5 个答案: