使用 jQuery 会话或其他可能的方式在下一页显示数据？

Question

这是我的简单形式：

<form id="myform">
    Name:<input type="text" name="name"><br>
    Email:<input type="text" name="email">
    <a class="btn btn-primary" id="click_btn">Submit</a>
</form>

我想提交带有Ajax的表单，目前还可以，正在提交。

这是我的 jquery 代码： $(文档).ready(函数() { $('#click_btn').on('click', function() {

    $.ajax({
      url: $('myform').attr('action'),
      data: $('myform').serialize(),
      method: 'post',

      success: function(data) {
        //success meseg then redirct
        alert('success');

        var data = $('#myform').serializeArray();

        var dataObj = {};

        $(data).each(function(i, field) {

          dataObj[field.name] = field.value;
          window.location.href = 'next_page.php';
        });
      }

    })


  });
})

next_page.php是我要访问的地方，例如：

<?php echo document.write(dataObj["email"]); ?>

我想在提交表单后访问我在下一页提交的这些表单值。我在提交后使用 jQuery 创建了一个包含所有值的数据对象，但我仍然无法访问下一页。 jquery 中是否有任何与 session 相关的概念用于存储该数组。

Answer 1

我认为您在这里混淆了几个概念；我的意思不是居高临下，只是想提供帮助。

jQuery 和所有 JavaScript 仅存在于客户端（出于实际目的 - 某些客户端代码可能在服务器端呈现或编译的例外情况无论出于何种原因，但这是另一回事）。 PHP，和其他任何服务器端语言一样，存在于服务器端。这两者不能直接访问彼此的作用域——这就是为什么 AJAX 对于在前端和后端之间传输数据很有用。

基本上，您在这里所做的似乎是在客户端加载数据，而不是向服务器端提交任何内容。您实际上并没有执行任何 AJAX 查询。当您通过 window.location.href =... 重定向用户时，实际上并没有传输任何数据 - 它只是指示浏览器向 next_page.php（或您指示它去的任何地方）发出新的 GET 请求。

有几个选项可以实现您想要实现的目标：

实际提交 AJAX 查询，使用此处概述的方法 http://api.jquery.com/jquery.ajax/。然后，您可以使用 next_page.php 获取数据并将其存储在会话中，并在用户到达页面时调用它。
将数据存储在客户端 cookie 中。
使用标准 HTML <form method="next_page.php"...><input type="submit"> 使浏览器将表单数据转发到 next_page.php 脚本。
许多其他选项，但我认为这些是最简单的。

Answer 2

 <?php echo document.write(dataObj["email"]); ?>

这不合理！ echo 是一个 PHP 命令，但是 document.write 是一个 JavaScript 命令。如果第二页是 PHP，为什么不使用简单的 POST 从 HTML 表单提交来发送数据？

Answer 3

你也可以使用localStorage:

var data = '123';
localStorage['stuff'] = data;

使用localStorage.clear();删除所有数据，如果你想重新写入或用于特定项目localStorage.removeItem('stuff');

Answer 4

你完全可以使用sessionStorage！ (Here is documentation)

如果用户直接转到同一选项卡中的下一页，sessionStorage 可以轻松保存您的数据并在下一页中重复使用。

// set in page A
window.sessionStorage.setItem('youdata', 'youdata');
// or window.sessionStorage['youdata'] = 'youdata';

// get in page B
var youdata = window.sessionStorage.getItem('youdata');
// or var youdata = window.sessionStorage['youdata'];

就是这样！很简单！

如果要打开新标签页，可以使用 localStorage。 (Here is documentation)

localStorage的用法与sessionStorage的用法相同。

在为其他页面保存信息时，这两种方式只需要浏览器支持即可。

Answer 5

一些可能的解决方案列表如下：

1. Post 使用 AJAX 请求的数据并通过数据库调用在下一页中获取数据（建议）

2。使用本地存储，您可以将数据存储在浏览器中以将其推送到 next_page.php https://www.w3schools.com/Html/html5_webstorage.asp

2a。在第一页

<script>
    localStorage.setItem("name", "John");
    localStorage.setItem("email", "John@test.com");
</script>

2b。在第二页

<script>
    var name = localStorage.getItem("name");
    var emaeil = localStorage.getItem("email");
</script>

3。使用浏览器会话存储 https://www.w3schools.com/jsref/prop_win_sessionstorage.asp

3a。在第一页

<script>
    sessionStorage.setItem("name", "John");
    sessionStorage.setItem("email", "John@test.com");
</script>

3b。在第二页

<script>
    var name = sessionStorage.getItem("name");
    var emaeil = sessionStorage.getItem("email");
</script>

使用 jQuery 会话或其他可能的方式在下一页显示数据？

Displaying data on next page with jQuery session or another possible way?

javascript

php

jquery

yii2

yii2-advanced-app