jquery - 发送带有jQuery $ .ajax的数组

我正在尝试将数组传递给ajax。这是代码（productOptions是ARRAY）

data: { action:'add',tblID : tblID, option:productOptions},

据我所知，这种方法（使用对象）的jQuery做的工作，但我根本没有得到选项参数（下面解释）。

注意 ：

var productOptions=new Array();
    productOptions[0]="test1";
    productOptions[1]="test2";

与上面的数组我得到productOptions

var productOptions=new Array();
        productOptions['color']="test1";
        productOptions['size]="test2";

我没有得到productOptions

任何帮助请

最佳答案

解决方案优先

将productOptions设置为Object而不是Array，然后使用jQuery.extend()将productOptions与要在ajax请求中使用的其余数据合并。

var productOptions = new Object();
productOptions['color']="test1";
productOptions['size']="test2";

$.ajax({
  type: "GET",
  url: "test.js",
  dataType: "script",
  data: jQuery.extend({action: 'add'}, productOptions)
});

产量GET test.js?_=randomjQueryNumber&action=add&color=test1&size=test2



冗长的解释

您的问题主要源于您假设Array对象与关联数组相同时所犯的错误。数组只有一些条目，这些条目可以从基于零的索引访问。而关联数组由(key, value)对组成。

您可以进行一个简单的测试

变体1

var productOptions=new Array();
productOptions[0]="test1";
productOptions[1]="test2";
alert(productOptions.length); //yields 2

注意：例如用productOptions[0]替换productOptions[4]警报将显示5！

变体2

var productOptions=new Array();
productOptions['color']="test1";
productOptions['size]="test2";
alert(productOptions.length); //yields 0

变体1 productOptions[0]="test1";的行为与productOptions.push("test1");相似（但不相同-检查变体1下的注释-push追加到数组的末尾，其他语法只是将元素设置在指定的索引处）。

变体2 productOptions['color']="test1";甚至不适用于“数组”；此语法与每个javascript对象的用法相同，它在对象上将属性color设置为值test1。

因此，如果您使用第二个变体中的语法，则实际上创建了一个具有两个属性color和size的空javascript数组对象。容易测试

alert(productOptions.color); //yields test1
alert(productOptions.size); //yields test2
alert(productOptions[0]); //yields undefined

这就是变量1起作用的原因。 productOptions是一个有效的数组，jQuery将其转换为类似于此option=test1&option=test2的查询字符串。

jQuery也可以正确处理第二个变体，因为option:productOptions实际上与option:new Array();相同