Question

这种情况之一我觉得我错过了一个关键的关键词，无法在Google上找到答案......

我有一个参数包，我想让浏览器导航到带参数的GET URL。作为一个jQuery用户，我知道如果我想发一个ajax请求，我只会这样做：

$.getJSON(url, params, fn_handle_result);

但有时候我不想使用ajax。我只想提交参数并返回页面。

现在，我知道我可以循环参数并手动构建GET URL。对于POST，我可以动态创建表单，用字段填充并提交。但是我确定有人已经编写了一个插件来执行此操作。或许我错过了一些东西，你可以用核心jQuery来做。

那么，是否有人知道这样的插件？

编辑：基本上，我想写的是：

$.goTo(url, params);

并可选择

$.goTo(url, params, "POST");

Answer 1

jQuery插件似乎工作得很好，直到我在IE8上尝试它。我不得不做一些小修改才能让它在IE上运行：

(function($) {
    $.extend({
        getGo: function(url, params) {
            document.location = url + '?' + $.param(params);
        },
        postGo: function(url, params) {
            var $form = $("<form>")
                .attr("method", "post")
                .attr("action", url);
            $.each(params, function(name, value) {
                $("<input type='hidden'>")
                    .attr("name", name)
                    .attr("value", value)
                    .appendTo($form);
            });
            $form.appendTo("body");
            $form.submit();
        }
    });
})(jQuery);

Answer 2

这是我最终做的，使用redsquare的提示：

(function($) {
    $.extend({
        doGet: function(url, params) {
            document.location = url + '?' + $.param(params);
        },
        doPost: function(url, params) {
            var $form = $("<form method='POST'>").attr("action", url);
            $.each(params, function(name, value) {
                $("<input type='hidden'>")
                    .attr("name", name)
                    .attr("value", value)
                    .appendTo($form);
            });
            $form.appendTo("body");
            $form.submit();
        }
    });
})(jQuery);

用法：

$.doPost("/mail/send.php", {
    subject: "test email",
    body: "This is a test email sent with $.doPost"
});

欢迎任何反馈。

更新：请参阅关于适用于IE8的版本的dustin的答案

Answer 3

从问题中不清楚你是否想要在查询字符串上传递一组随机值，或者它是否为表单值。

对于表单值，只需使用.serialize函数构造查询字符串。

e.g

var qString = $('#formid').serialize();
document.location = 'someUrl' + '?' + serializedForm

如果您有一组随机值，则可以构造一个对象并使用.param实用程序方法。

e.g

 var params = { width:1680, height:1050 };
 var str = jQuery.param( params );
 console.log( str )
 // prints width=1680&height=1050
 // document.location = 'someUrl' + '?' + str

Answer 4

对于执行doPost for rails 3的任何人来说，你需要添加CSRF令牌，在答案中添加以下内容应该这样做......

var token = $('meta[name="csrf-token"]').attr('content');
$("<input name='authenticity_token' type='hidden' value='" + token + "'/>").appendTo($form);

Answer 5

这类似于上面的内容，除了它将处理传递给MVC的数组参数

(function($) {
    $.extend({
        getGo: function(url, params, traditional) {
            /// <summary>
            ///     Perform a GET at url with specified params passed as part of the query string.
            /// </summary>
            /// <param name="url"></param>
            /// <param name="params"></param>
            /// <param name="traditional">Boolean:  Specify true for traditional serialization.</param>
            document.location = url + '?' + $.param(params, traditional);
        },
        postGo: function (url, params) {
            /// <summary>
            ///     Perform a POST at url with the specified params as part of a form object.
            ///     If a parameter is an array then it will submit it as multiple attributes so MVC will see it as an array
            /// </summary>
            /// <param name="url" type="string"></param>
            /// <param name="params" type="Object"></param>
            var $form = $("<form>").attr("method", "post").attr("action", url);
            $.each(params, function (name, value) {
                if (value.length != null && value.length > 0) {
                    for (var i = 0; i < value.length; i++) {
                        $("<input type='hidden'>").attr("name", name + '[' + i + ']').attr("value", value[i]).appendTo($form);
                    }
                }
                else {
                    $("<input type='hidden'>").attr("name", name).attr("value", value).appendTo($form);
                }
            });
            $form.appendTo("body");
            $form.submit();
        }
    });
})(jQuery);

Answer 6

干得好！如果你想要一个不可见的形式把它放入隐藏的DIV：

(function($) {
    $.extend({
        doGet: function(url, params) {
            document.location = url + '?' + $.param(params);
        },
        doPost: function(url, params) {
            var $div = $("<div>").css("display", "none");
            var $form = $("<form method='POST'>").attr("action", url);
            $.each(params, function(name, value) {
                $("<input type='hidden'>")
                    .attr("name", name)
                    .attr("value", value)
                    .appendTo($form);
            });
            $form.appendTo($div);
            $div.appendTo("body");
            $form.submit();
        }
    });
})(jQuery);

Answer 7

接受的答案似乎不包括您的POST要求，因为设置document.location将始终产生GET请求。这是一个可能的解决方案，虽然我不确定jQuery是否允许加载页面的全部内容，如下所示：

$.post(url, params, function(data) {
  $(document).html(data);
}, "html");

使用jQuery的非ajax GET / POST（插件？）

7 个答案: