如何在不使用Ajax和JavaScript重新加载的情况下将一个php页面的值传递给另一个页面

How to get a value to one php page to another without reload with Ajax and JavaScript

本问题已经有最佳答案,请猛点这里访问。
1
2
3
4
5
6
7
8
9
10
11
12
13
 <html>
 <body>
 
    <form name="form1" id="main_form" method="post" target="_parent"   action="checklogin.php">
          <input name="myusername" type="text" id="myusername"  placeholder="User Name Here">
          <input name="mypassword" type="password" id="mypassword"  placeholder="Password Here">
          <input type="submit" name="Submit" id="gogogo" value="Login">
          <p id="msg" name="msg"><?php echo $_GET['msg']; ?>
</p>
    </form>
 
</body>
</html>

所以这是我的登录表单,我使用GET方法获取邮件密码是否错误,所以问题是当我点击提交页面时刷新,我不希望我的页面重新加载,有什么办法吗 无需使用AjaxJavaScript JQuery重新加载页面即可获得结果


据我所知,有三种方法可以在客户端和服务器之间传递信息:

  • 页面加载
  • AJAX
  • 的WebSockets
  • AJAX是普通的JavaScript,根据您的浏览器支持,您可能需要以几种不同的方式实现它以支持旧版本和新版本。大多数人使用jQuery的$ .ajax()函数,因为它使编写(和读取)更容易。

    如果您不想要AJAX或页面重新加载,唯一的另一个选择是使用websockets,但是在特定的服务器端和客户端软件上存在很多依赖性。这是相对较新的,所以没有很多"初学者指南"。
    不过,这可能会让你开始:http://www.phpbuilder.com/articles/application-architecture/optimization/creating-real-time-applications-with-php-and-websockets.html


    这是一个使用简单的vanilla JavaScript的简单ajax请求

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    function request(url, callback) {

      var req = new XMLHttpRequest();

      req.onreadystatechange = function() {
        if (req.readyState !== XMLHttpRequest.DONE) return;

        switch (req.status) {
          case 200:
            return callback(null, req.responseText);
          case 404:
            return callback(Error('Sorry, 404 error'));
          default:
            return callback(Error('Some other error happened'))
        }
      };

      req.open("GET", url, true);
      req.send();

      return req;
    }

    你可以像这样使用它

    1
    2
    3
    4
    5
    6
    7
    8
    var req = request('/some-data.json', function (err, res) {

      // check for error
      if (err) return console.error(err);

      // do something with the data
      console.log(JSON.parse(res));
    });

    请注意,您必须进行一些额外的研究才能在旧的IE浏览器上支持此功能。


    唯一的方法是使用AJAX,使用JavaScript也更容易。使用jQuery库中的$.post()可以轻松实现。

    示例(使用jQuery):

    1
    2
    3
    4
    5
    6
    7
    8
    9
    <script type="text/javascript">
        $("form#main_form").submit(function(e){
            e.preventDefault(); //stops the form submitting normally
            var formData = $(this).serializeArray(); //make an array of the form data

            $.post("checklogin.php", formData, function(response){ //POST the form data to 'checklogin.php'
                console.log(response); //output PHP response to console
            });
        });