Jquery多维数组

我正在创建一个应用程序，用户填写徽标的所有信息并将其添加到列表中，然后可以添加更多徽标或删除它们。 想象一下，我在列表中添加了一个徽标，其中包含以下信息：

名称：百事可乐
位置：正面，背面
尺寸：90mm，60mm
颜色：红色，蓝色，白色
选项：Whitebg
评论：这是一个很酷的标志。

该数组将是：

logos[logo[name, loc[], dim[], col[], opt[], com]] 

现在我可以这样做来检索一些信息：

 logos[0][0] //Prints "Pepsi" logos[0][1][0] //Prints "Front" logos[0][2][1] //Prints "60mm" 

现在出现了问题。 每当用户完成所有信息并添加徽标列表时，我想清空除主“徽标”之外的所有arrays，以便用户可以向列表中添加另一个徽标。

我试图在“添加”按钮function结束时清空“徽标”数组：

 logo.length = 0; 

但是现在主arrays“logos”包含一个“logo”数组，其中是空的。 我想在那里保留那些信息。

Answer 1

我想你可以用不同的方式来看待它。 我想你应该有一个主要的标识数组。 还有一个徽标对象。

徽标对象。

 function Logo(name,loc, dim, col, opt, com){ return { name:name, loc:loc, dim:dim, col:col, opt:opt, com:com } } var logos = []; logos.push(Logo("blah",somthing[],else[]....); 

然后参考：

  logos[0].name; logos[0].dimensions[0]; 

….

你可以添加另一个……

  logos.push(Logo("another",....)); 

另外一个选项

和以前一样。

但不是Logos []而是使用Logos = {}对象。

您可以通过这样的给定输入动态添加属性。

 Logos["First"] = Logo(loc,dim,col,opt,com); Logos["Second"] = Logo(loc2,dim2,col2,opt2,com2); 

如果用户输入他们想要的“First”徽标。

您可以使用

 var firstlogo = Logos["first"]; firstlogo.loc[0] etc. 

玩弄它，使用对象可以更好地理解您正在处理的数据，尤其是当多维数组不是“必需”时

Answer 2

我想你想要这样做：

 var tempLogo = new Array(); tempLogo[0] = logos[0]; // or the logo you have choose // Clear the logo logos.clear(); // Set the logos with the tempLogo value logos = tempLogo; 

Answer 3

最后，我使用对象而不是数组作为“Bodman”建议。 工作得更好，更简单。

HTML：

          
 
Name:
 
Location: Front  Back  Right  Left
 
Dimensions:H:  W: 
 
Colors:   
 
Comments:
 
  
 
 
     

CSS：

 body { padding: 50px; } p { margin: 10px 0; } label { float: left; width: 100px; } input { margin: 0 } ul input[type="checkbox"]{ float:left; } ul { list-style: none;} li { margin: 10px 0; } li div { margin-left: 20px; } h2 { font: bold 14px Arial; margin-bottom: 5px; } 

jQuery的：

 $(function(){ function logo(name, loc){ var locSize = loc.length; return { name: name, loc: loc, locSize: locSize } } var logos = []; $("#add").click(function(){ var name = $("#name").val(); var loc = []; $("input[name='loc']:checked").each(function(){ loc.push($(this).val()); }); logos.push(logo(name, loc)); $("#results").children().remove(); $.each(logos, function(n){ $("#results").append("
" + logos[n].name + "
 Locations(" + logos[n].locSize + "): " + logos[n].loc.join(", ") + "
"); }); }); $("#del").click(function(){ $("#results input[type='checkbox']:checked").each(function(){ var index = $(this).closest("li").index(); logos.splice(index, 1); $(this).closest("li").remove(); }); });