Javascript 使用AJAX和PHP通过modal登录

平心而论，我在AJAX领域是个新手（更准确地说是新手），我想我在这个领域做了很多工作。因此，我花了好几天的时间试图用我的PHP脚本实现AJAX。在你把这个问题标记为重复之前，请考虑我已经尝试过这个网站的所有发布的问题，而不是一个解决方案弹出。话虽如此，我希望实现以下目标：我希望在PHP脚本成功或失败后显示某种消息，如下图所示：

如果有成功的显示我消息，并重定向我（2秒后）到管理网站，如果没有显示我错误

下面是模态形式的代码：

<div class="modal fade" id="test" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
   <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal">&times;</button>
      <h4 class="modal-title">test</h4>
   </div>
   <div class="modal-body">
      <form  id="myform" method="POST" role="form">
         <div class="form-group">
            <label for="user">User:</label>
            <input name="user" type="text" class="form-control"  placeholder="Unesi korisnika">
         </div>
         <div class="form-group">
            <label for="pass">Password:</label>
            <input name="pass" type="password" class="form-control"  placeholder="Unesi lozinku">
         </div>
         <div id="error">
            <div class="alert alert-danger"> <strong>Error, try again!</strong> </div>
         </div>
         <div id="thanks">
            <div class="alert alert-success"> <strong>Logging in..</strong></div>
         </div>
   </div>
   <div class="modal-footer">
   <button type="button" class="btn btn-default"  id="reset" data-dismiss="modal">Close</button>
   <button type="submit" class="btn btn-success" id="submitForm">Login!</button>
   </form>
   </div>

下面是myAuth类中的PHPdoLogin（）函数：

static function doLogin() {
    if(
        !empty($_POST['user'])
        &&
        !empty($_POST['pass'])
    ) {
        if(!session_id()) session_start();
        // check and retrive user with sended pass
        $user = self::_fetchUserWithPassDB();

        // if user found log in
        if($user) {
            // security


            $token = md5(rand(100000,999999));

            // save token in session
            $_SESSION["auth"] = $token;

            // save user in session
            $_SESSION["user"] = $user[0]["user"];

            // save role in session
            $_SESSION["role"] = $user[0]["role"];

            // postavi validity and token in cookie, session in base
            self::_setCookieSessionDBTokenValidity();                   
            // redirect on admin.php 
            header( "refresh:2;url=admin.php" );
        }
        else {

            header('Location:index.php');
        }

        if(!$user) {
            header("refresh:1;url=index.php" );
        }


    } // od if POST

最后是我的login.php

<?php
// login.php
require_once('init.php'); 
myAuth::doLogin();

?>

试着移动

<form  id="myform" method="POST" role="form">

外

<div class="modal fade" id="test" role="dialog">

i、 e

...

---

当前，您的HTML无效（为什么不避免使用serialize并直接传递值呢？…什么都没有发生，只是测试了一下…无论如何，您需要从

成功

回调重定向到某个地方，可能是使用

窗口。location

不应该

单击
be
submit
？您可能需要使用ja执行重定向vascript.也尝试过：
$（“#myform”）.submit（函数（e）{var url=“login.php”；$.ajax（{type:“POST”，url:url，data:$（“#myform”）.serialize（），success:function（）{$（“#谢谢”）.show（），setTimeout（函数（）{window.location.href=“admin.php”}，2000）；}，错误：function（）{$（“#error”）.show（）；}；e.preventDefault（）；}）
不幸的是，它不起作用，只在重定向中起作用（为了公平起见，修复了更大的问题块）。问题仍然在于错误处理。因此，如果我成功登录，它会触发成功事件，但如果登录不成功，它仍会触发
#感谢div
，但重定向不会发生任何事情。但是，伟大的工作人员！！我高估了你的答案如果这解决了你的主要问题，你应该尽可能接受它作为正确答案。另一个问题可能是
$（“#谢谢”）.show（）中的结尾逗号，
应该是分号。它可能会帮助您在Google Chrome中打开浏览器工具，以便您可以看到出现的任何语法错误。如果这不能解决第二个问题，最好打开另一个问题。公平地说，它只解决了一半问题，如果我不这样做，我将尝试在合理的时间内解决整个问题“我不会成功，我会将你的答案标记为正确答案。（我尝试了
$（“#谢谢”）.show（），
，但没有任何更改…）再次，谢谢帮助：）尝试分号（
；
）而不是逗号（
，
）
$("#myform").submit(function(e) {
    var url = "login.php";
    $.ajax({
        type: "POST",
        url: url,
        data: $('#myform').serialize(),
        success: function() {
            $("#thanks").show(), setTimeout(function() {
                window.location.href = "admin.php";
            }, 2000);
        },
        error: function() {
            $("#error").show();
        }
    });
    e.preventDefault();
});

<form  id="myform" method="POST" role="form">

<div class="modal fade" id="test" role="dialog">

<form  id="myform" method="POST" role="form">
    <div class="modal fade" id="test" role="dialog">
        ...
    </div>
</form>