Javascript $.post 和 $.ajax 的区别?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/12820074/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 08:33:26  来源:igfitidea点击:

Difference between $.post and $.ajax?

javascriptjqueryajaxasp.net-mvcserialization

提问by Ed DeGagne

Curious if anyone knows what the difference is in regards to the data parameter.

好奇是否有人知道数据参数有什么区别。

I have a $.postmethod that takes a $('#myform').serialize()as my data param and works.

我有一种$.post方法将 a$('#myform').serialize()作为我的数据参数并起作用。

If I try the same using the $.ajax()approach, it doesn't work as my data param doesn't appear correct.

如果我使用该$.ajax()方法尝试相同的方法,则它不起作用,因为我的数据参数看起来不正确。

Does anyone know the difference and what I might use instead of the above .serialize?

有谁知道其中的区别以及我可能会使用什么来代替上述内容.serialize

采纳答案by Ed DeGagne

After re-reading some online documentation, I decided to stick with $.post over $.ajax.

在重新阅读了一些在线文档后,我决定坚持使用 $.post 而不是 $.ajax。

The $.ajax method's data param does something different than the $.post method does, not sure what exactly, but there is a difference.

$.ajax 方法的数据参数与 $.post 方法做的事情不同,不确定到底是什么,但有区别。

The only reason I wanted to use $.ajax is because I wanted to be able to handle events and didn't realize I could do so with $.post.

我想使用 $.ajax 的唯一原因是因为我希望能够处理事件并且没有意识到我可以使用 $.post 来做到这一点。

Here is what I ended up with

这是我最终得到的

function GetSearchItems() {
    var url = '@Url.Action("GetShopSearchResults", "Shop", New With {.area = "Shop"})';
    var data = $("#ShopPane").serialize();
    // Clear container
    $('#shopResultsContainer').html('');
    // Retrieve data from action method
    var jqxhr = $.post(url, data);
    // Handle results
    jqxhr.success(function(result) {
        //alert("ajax success");
        $('#shopResultsContainer').html(result.ViewMarkup);
    });
    jqxhr.error(function() {
        //alert("ajax error");
    });
    jqxhr.complete(function() {
        //alert("ajax complete");
    });

    // Show results container
    $("#shopResultsContainer").slideDown('slow');
}

JQuery 3.x

jQuery 3.x

The jqXHR.success(), jqXHR.error(), and jqXHR.complete() callback methods are removed as of jQuery 3.0. You can use jqXHR.done(), jqXHR.fail(), and jqXHR.always() instead.

jqXHR.success()、jqXHR.error() 和 jqXHR.complete() 回调方法从 jQuery 3.0 开始被移除。您可以改用 jqXHR.done()、jqXHR.fail() 和 jqXHR.always()。

var jqxhr = $.post(url, data);
// Handle results
jqxhr.done(function(result) {
    //alert("ajax success");
});
jqxhr.fail(function() {
    //alert("ajax error");
});
jqxhr.always(function() {
    //alert("ajax complete");
});

https://api.jquery.com/jquery.post/

https://api.jquery.com/jquery.post/

回答by rahul

This post will be helpful for you.

这篇文章会对你有所帮助。

Forum Link

论坛链接

In short following :

简而言之:

$.post( "/ajax", {"data" : json }) 

Is equivalent to :

相当于:

$.ajax({ 
  type: "POST", 
  url: "/ajax", 
  data: {"data": json} 
}); 

回答by epascarello

The problem here is not the fact $.ajax()is not working, it is because you did not set the type parameter in the Ajax request and it defaults to a GET request. The data is sent via the query string for get and if your backend expects them as post parameters, it will not read them.

这里的问题不是事实上$.ajax()不起作用,而是因为您没有在 Ajax 请求中设置类型参数,它默认为 GET 请求。数据通过 get 的查询字符串发送,如果您的后端希望它们作为 post 参数,它不会读取它们。

$.postis just a call with $.ajax(), just with the typeset. Read the docsand you will see that $.ajax()defaults to a GET as I mentioned above.

$.post只是一个电话$.ajax(),只是与type集合。阅读文档,您将看到$.ajax()默认为我上面提到的 GET。

If you go to the jQuery.postpage in the jQuery docs it shows you the $.ajax request with the type set. Again read the docs.

如果您转到jQuery 文档中的jQuery.post页面,它会显示带有类型集的 $.ajax 请求。再次阅读文档。

回答by dove

Are you specifying this as the data parameter. $.postis just a shorthand for $.ajaxwhich is expecting the following.

您是否将此指定为数据参数。$.post只是一个速记,$.ajax期待以下内容。

$.ajax({
    type : 'POST',
    url : url,
    data : data,
    success : success,
    dataType : dataType
});

回答by spilote

Just as a complementary, in the accepted answer, it is mentionned that "The $.ajax method's data param does something different than the $.post method does, not sure what exactly, but there is a difference"

作为补充,在已接受的答案中,提到“ $.ajax 方法的数据参数与 $.post 方法所做的事情有所不同,不确定究竟是什么,但存在差异

please try using :

请尝试使用:

    { 
        ... 
        data: JSON.stringify(yourJsonData), 
        ... 
    }

Else the json object get's inserted in the payload as a url-encoded string.

否则,json 对象将作为 url 编码字符串插入到有效负载中。

回答by nagaking

In $.ajaxyou are able to synchronize, but it is not possible in the $.postfunction. To synchronize means that you can get the returned result.

$.ajax您可以同步,但在$.post功能中是不可能的。同步意味着您可以获得返回的结果。

var tmp;
$.ajax({
    'async': false,
    'type': "POST",
    'global': false,
    'dataType': 'html',
    'url': "Your Url",
    'data': {'type': 'data'},
    'success': function (data) {
        tmp = data;
    }
});
alert(tmp);