在javascript / jquery中捕获“表单数据”而不是查询字符串

Question

我正在尝试不同的东西来检查它是否可行。否则最好的替代方法是使用查询字符串发送数据。

1. 我有一个html页面，其中包含学生列表。当用户点击特定学生进行编辑时，此html页面应该获取学生ID并重定向到另一个html页面，该页面将加载相应的学生详细信息以进行编辑。

2. 在这里，我想使用＆＃34; POST＆＃34; 方法发送数据以隐藏来自URL（查询字符串）的studentID，因此我创建了一个hindden表单（method =＆＃ 34; POST＆＃34; action =＆＃34; edit.html＆＃34;）列表html并在其下放置一个隐藏字段。在列表上的编辑按钮的lcik上，我将值设置为隐藏字段＆amp;提交表格。

3. 现在重定向正确以编辑html页面，当我在chrome开发人员工具中看到此流程时，我可以在标题部分 - 表单数据下看到此表单值。现在我试图在编辑html页面加载时记录这个表单数据，例如在JQuery下文档就绪功能或简单的javascript。

4. 如果我创建了hindden表单（方法=＆＃34; GET＆＃34; action =＆＃34; edit.html＆＃34;），则使用替代选项，然后显示我正在设置的隐藏字段值在查询字符串和chrome开发人员工具中，它显示在标题下 - 查询字符串参数。可以使用location.search轻松访问此查询字符串参数，然后播放并获得预期值。

5. 这里的id我只是举例，但在实际场景中，我需要发送多个值，或者可能是我不想发送的查询字符串。所以我想用POST方法提交表单，然后在下一个HTML页面上重试值，在jquery上加载jrugh javascript。

HTML

<form style="display: none" action="jquerywebapidoestudenteditpoc.html" method="post" id="formEdit"> <input type="hidden" id="id" name="id" value="" /> </form>

JQuery

$(document).on("click", ".edit", function () { var id = $(this).data("id"); $("#id").val(id); event.preventDefault(); $("#formEdit").submit(); });



如果有人遇到这种情况或以非常恰当的方式实施，那将是非常好的。

换句话说，我想实现的是：

1. list.html会将数据发布到服务器（.NET Web API）
2. 同时list.html将重定向到edit.html
3. 在加载edit.html时，将在页面上加载来自服务器的响应。

Answer 1

查询字符串是＆＃34;标识符＆＃34;的一部分。随后加载的页面（或任何其他资源）。因此，可以从页面访问它。在POST请求正文中发送的数据是不同的 - 它们仅用于服务器，并且无法从随后加载的页面中访问。

但是，如果您希望将使用POST发送的数据提供给下一页，则可以始终手动将其注入页面。使用PHP（作为示例），它看起来像这样：

<script type="text/javascript">
    var postData = <?php json_encode($_POST); ?>;
</script>

---

如果您只想将数据从一个页面传递到另一个页面并使服务器不在其中，您可以使用GET（查询字符串）进行公开的通信，也可以使用Cookie来保护＆＃34;隐藏＆＃34 ;通信。

Answer 2

实际上，经过很多博客和网站后我理解的东西，我必须有一个客户端控制器（基于javascript），它将负责哪个视图必须加载和发布数据。 这个我能够实现使用AngularJS，我可以在那里配置路由，同样，我可以发布数据＆amp;在另一个视图/表单（所谓的页面）上接收其输出。

e.g。

$routeProvider.when("/orders", {
        controller: "ordersController",
    templateUrl: "/app/views/orders.html"
});

AngularJS Rocks !!!