非 AJAX jQuery POST 请求答案

【问题标题】：Non-AJAX jQuery POST request非 AJAX jQuery POST 请求
【发布时间】：2010-01-13 05:45:45
【问题描述】：

我正在尝试使用 jQuery POST 函数，但它以 AJAX 样式处理请求。我的意思是它实际上并没有进入我告诉它去的页面。

$("#see_comments").click(function() {
    $.post(
        "comments.php", 
        {aid: imgnum}, 
        function (data) {

        }
    );
});

这个函数应该转到 cmets.php 页面并且手头有辅助值。它发布得很好，但没有重定向到 cmets.php。

@Doug Neiner 澄清：

我有 15 个链接（图片）。我单击一个链接，它会加载我的 JavaScript。脚本知道我打开了什么imgnum。这个imgnum我想在cmets.php中。我必须使用这个 JavaScript，没有其他方法可以做到这一点。 JavaScript 是强制性的
您的方法成功发布了辅助值。但是在 cmets.php 中，当我尝试回显该值时，它什么也不显示。
我正在使用 Firebug。在控制台中，它显示了我在步骤（2）中成功创建的 echo REQUEST。

【问题讨论】：

呃？重定向？也许您可以多解释一下您要做什么。
cmets.php 是否与请求文件在同一文件夹中？
这篇 SO 帖子可能会有所帮助 stackoverflow.com/questions/1149454/…
@metrobalderas：我认为这很清楚。 @pulse：是的。

标签： javascript jquery

【解决方案1】：

我知道你想要做什么，但这不是你想要的。

首先，除非您更改服务器上的数据，否则不要使用POST 请求。让#see_comments 成为普通的<a href='/comments.php?aid=1'>...

如果您有使用POST，请执行此操作以使页面跟随您的呼叫：

$("#see_comments").click(function() {
  $('<form action="comments.php" method="POST">' + 
    '<input type="hidden" name="aid" value="' + imgnum + '">' +
    '</form>').submit();
});

这实际上是如何工作的。

First $.post 只是一种 AJAX 方法，不能用于像您描述的那样执行传统的 form 提交。因此，为了能够发布值并导航到新页面，我们需要模拟form 发布。

所以流程如下：

你点击图片，你的JS代码得到imgnum
接下来，有人点击#see_comments
我们创建一个临时的form，其中的imgnum 值作为隐藏字段
我们提交该表单，该表单发布值并加载comments.php页面
您的 comments.php 页面将可以访问发布的变量（即在 PHP 中为 $_POST['aid']）

【讨论】：

援助值来自数据库。所以我真的很想让 jquery 工作。因为我也需要我的 Javascript。
@amit，在您发布的代码中，aid 值不是来自数据库，它被发送到 AJAX 请求。你没有发布你的全部功能吗？
@amit，那么你的问题不清楚。我的代码 POST 是 comments.php 文件的 imgnum 并同时重定向。你还想让它做什么？
@amit，我并不反对您 imgnum 的来源，只是我的答案与您的代码完全平行，除了重定向之外。只需尝试用您的 $.post 替换 $('form... .submit(); 调用，看看它是否不完全符合您的要求。
您应该将表单附加到 DOM，否则 IE 和 Firefox 会忽略提交（如果您想添加更多非隐藏字段 - 例如文本输入 - 然后调用 .hide()也需要在 .appendTo() 之前避免内容跳转）

【解决方案2】：

$("#see_comments").click(function () {
    $('<form action="comments.php" method="POST"/>')
        .append($('<input type="hidden" name="aid">').val(imgnum))
        .appendTo($(document.body)) //it has to be added somewhere into the <body>
        .submit();
});

【讨论】：

这应该结合到接受的答案中。如果没有 DOM 中的表单，它将无法在 Firefox 和可能的其他浏览器中提交。
Edge 中没有此代码也会出现错误，例如“表单提交因表单未连接而取消”。上述解决方案有效。

【解决方案3】：

虽然 Doug Neiner 的解决方案不仅正确而且解释最全面，但它有一个大问题：它似乎只适用于 Chrome。

我坐立不安了一会儿，试图确定一个解决方法，然后偶然发现了 nopnop77 的第二个答案。唯一的区别是额外的代码appendTo($(document.body))。然后我在 firefox 中对其进行了测试，它就像一个魅力。显然，Firefox 和 IE 需要将临时表单附加到 DOM Body 的某个位置。

我必须为 Symfony2 项目执行此实现，因为 .twig 模板中的路径生成器只能与 GET 参数一起使用，并且弄乱查询字符串会对应用程序的安全性造成严重破坏。（顺便说一句，如果有人知道如何让 .twig 模板调用带有 POST 参数的页面，请在 cmets 中告诉我）。

【讨论】：

这必须是评论，不是答案，它只是提供更多信息和澄清，不是提供新答案。

【解决方案4】：

我认为您要访问“cmets.php”并发布aid 值imgnum。这样做的唯一方法是使用表单提交此值。

但是，您可以隐藏此表单，然后使用 jquery 在某处任意点击提交它。

必要的html（放在页面上的任何地方）：

<form id='see_comments_form' action='comments.php' action='POST'>
    <input id='see_comments_aid' type='hidden' name='aid' value=''>
</form>

需要js：

$("#see_comments").click(function(){
    $('#see_comments_aid').val(imgnum);
    $('#see_comments_form').submit();
);

这将重定向到“cmets.php”并发送正确的值imgnum（我假设你是从其他地方得到的）。

【讨论】：

【解决方案5】：

实际上，$.post() 向服务器发送了一些数据。除非您在处理 POST 请求的服务器端代码中执行此操作，否则它不会导致任何重定向。我可以提出两种解决方案：

要转到评论页面，而不是使用 JQuery 帖子，您可以简单地使用“锚”标签 - <a href="comments.php?aid=1">Show Comments</a>。
或者如果你想通过JQuery，你可以使用这个代码sn-p：$(location).attr("href", "comments.php?aid=1");

【讨论】：

【解决方案6】：

并没有完全解决问题。但确实设法解决了这个问题。我不得不对 JS 做很多修改才能完成这项工作，但这个问题的核心问题通过这样做解决了：

    $("#see_comments").attr({href: "comments.php?aid='"+imgnum+"'"});

正如@Doug Neiner 最初建议我做的那样，这将辅助值附加到 URL。非常感谢 Doug 的所有努力。我真的很感激。 +1 并接受您的努力。

【讨论】：