如何正确地将URL参数添加到AJAX数据对象?

时间:2016-02-12 00:23:20

标签: javascript jquery json ajax xmlhttprequest

我有一个奇怪的问题,我似乎无法弄明白。我的应用程序使用AJAX来命中JSON并检索数据。我使用平台的内置参数支持过滤categorytag。所以我的格式(有效)看起来像这样:

示例(工作):

$.ajax({
  url: "http://blog.squarespace.com/blog", 
  data: {format:"json",tag:"mobile"}, 
  dataType: "json", 
  method: "GET"
}).done(function(data){ console.log(data) });

记录数据:

Object {website: Object, websiteSettings: Object, collection: Object, template: Object, shoppingCart: Object…}
calendarView: false
collection: Object
empty: false
emptyFolder: false
items: Array[1]
shareButtons: Object
shoppingCart: Object
showCart: false
tagFilter: "mobile"
template: Object
website: Object
websiteSettings: Object
__proto__: Object

在上面,您可以看到它检索到items数组,因为存在一个帖子。

当我点击使用多个单词或非字母字符的类别/标签时,会出现问题。

AJAX请求示例(不工作):

$.ajax({
  url: "http://blog.squarespace.com/blog", 
  data: {format:"json",tag:"Lee%20and%20Morris"}, 
  dataType: "json", 
  method: "GET"
}).done(function(data){ console.log(data) });

Object {website: Object, websiteSettings: Object, collection: Object, template: Object, shoppingCart: Object…}
calendarView: false
collection: Object
empty: false
emptyFolder: false
shareButtons: Object
shoppingCart: Object
showCart: false
tagFilter: "Lee%20and%20Morris"
template: Object
website: Object
websiteSettings: Object
__proto__: Object

您只需访问浏览器中的网址即可确认此位置有可用帖子:http://blog.squarespace.com/?format=json&tag=Lee%20and%20Morris

尝试调试后,我还发现通过附加标记参数并点击该网址,它可以按预期工作。

示例(工作):

$.ajax({
  url: "http://blog.squarespace.com/blog?tag=Lee%20and%20Morris", 
  data: {format:"json"}, 
  dataType: "json", 
  method: "GET"
}).done(function(data){ console.log(data) });

calendarView: false
collection: Object
empty: false
emptyFolder: false
items: Array[1]
shareButtons: Object
shoppingCart: Object
showCart: false
tagFilter: "Lee%20and%20Morris"
template: Object
website: Object
websiteSettings: Object
__proto__: Object

所以我的问题是为什么在使用data对象时这不起作用,但是否则可以正常工作?

1 个答案:

答案 0 :(得分:0)

根据Felix King的评论,我的问题是由于jQuery为您编码数据对象字符串。通过使用未编码的字符串简单地执行请求,我的问题就解决了。

$.ajax({
  url: "http://blog.squarespace.com/blog", 
  data: {format:"json",tag:"Lee and Morris"}, 
  dataType: "json", 
  method: "GET"
}).done(function(data){ console.log(data) });
相关问题