1

我知道有很多关于此的问题,但我找不到解决我的问题的方法,并且已经研究了一段时间。我有两组具有相同名称的输入字段,一组用于产品代码,一组用于产品名称。这些输入字段可以被用户拿走并添加到 DOM 中,因此可以有多个:

这是我到目前为止所拥有的,尽管这样可以保存它,所以所有代码都在一个数组中,而所有名称都在另一个数组中:

var updatedContent = [];
var varCode = {};
var varName = {};

$('.productVariationWrap.edit input[name="varVariationCode[]"]')
   .each(function(i, vali){
     varCode[i] = $(this).val();
   });

$('.productVariationWrap.edit input[name="varVariationName[]"]')
  .each(function(i1, vali1){
    varName[i1] = $(this).val();
  });

updatedContent.push(varCode);
updatedContent.push(varName);

我正在尝试获取它,以便名称和代码进入同一个数组。即代码是K = V 对的关键?

基本上这样我就可以遍历最终数组并轻松访问代码和相关名称。

我可以很容易地在 PHP 中做到这一点,但在 javascript 中没有运气。

编辑

我希望数组看起来像:

[
    [code1, name1],
    [code2, name2],
    [code3, name3]
];

因此,在我可以执行循环并对主数组中的每个数组进行循环之后,我可以对键(例如 code1)和关联的值(例如 name1)执行一些操作。这有意义吗?它有点像多维数组,尽管有些人可能会在涉及 Javascript 时反对该声明的有效性。

4

3 回答 3

3

我认为您最好创建一个对象,这样您以后就可以访问键/值对而不必循环,如果您不想这样做:

var $codes = $('.productVariationWrap.edit input[name="varVariationCode[]"]'),
    $names = $('.productVariationWrap.edit input[name="varVariationName[]"]'),
    updatedContent = {};

for (var i = 0, il = $codes.length; i < il; i++) {
    updatedContent[$codes.get(i).value] = $names.get(i).value;
}

现在例如 ,updatedContent.code1 == name1如果需要,您可以遍历对象:

for (var k in updatedContent) {
    // k == code
    // updatedContent[k] == name
}
于 2013-03-18T22:39:58.527 回答
1

使用两个循环可能不是最优的。最好使用一个循环来收集所有项目,无论是代码还是名称,然后将它们组装在一起。

另一个问题:你的选择器在我看来有点滑稽。您说页面中可以有多个这样的控件,但是控件具有重复名称是不正确的,除非它们是互斥的单选按钮/复选框 - 除非每对输入都在其自己的祖先中<form>?有关此的更多详细信息将帮助我提供更好的答案。

并注意:在您的代码中,您将 varCode 和 varName 变量实例化为 objects {},然后像 arrays 一样使用它们[]。那是你的意图吗?当我第一次回答你时,我被“最终输出应该看起来像这个数组”分散了注意力,并错过了你想要对象中的键 = 值对。如果您的意思是您所说的最终结果是嵌套数组,那么您可以对代码进行的最小修改以使其按原样工作如下所示:

var updatedContent = [];

$('.productVariationWrap.edit input[name="varVariationCode[]"]')
   .each(function(i, vali){
      updatedContent[i] = [$(this).val()]; //make it an array
   });

$('.productVariationWrap.edit input[name="varVariationName[]"]')
   .each(function(i1, vali1){
      updatedContent[i1].push($(this).val()); //push 2nd value into the array
   });

但是既然你希望你Code是值的唯一索引Name,那么我们需要使用对象而不是数组,Code键是Name值:

var updatedContent = {},
   w = $('.productVariationWrap.edit'),
   codes = w.find('input[name="varVariationCode[]"]'),
   names = w.find('input[name="varVariationName[]"]');

for (var i = codes.length - 1; i >= 0; i -= 1) {
   updatedContent[codes.get(i).val()] = names.get(i).val();
});

请注意,这将产生一个对象,符号将如下所示:

{
    'code1': 'name1',
    'code2': 'name2',
    'code3': 'name3'
};

现在您可以updatedContent像这样使用对象:

var code;
for (code in updatedContent) {
    console.log(code, updatedContent[code]); //each code and name pair
}

最后,依靠CodeName输入以相同的顺序在单独的 jQuery 对象中返回似乎有点脆弱。确保您将正确的代码与正确的名称相关联的某种方法对我来说似乎很重要——即使您现在的操作方式正确,谁能说未来对页面布局的修订不会破坏某些东西?我只是更喜欢显式关联而不是依赖页面元素顺序,但您可能不觉得需要这种保证。

于 2013-03-18T22:37:26.150 回答
0

我不喜欢用两个循环解决它的方法

 var updatedContent = [] 

 $('.productVariationWrap.edit').each(function(i, vali){
     var $this = $(this)
     , tuple = [$this.find('input[name="varVariationCode[]"]').val()
                , $this.find('input[name="varVariationName[]"]').val()]

     updatedContent.push(tuple)
 });
于 2013-03-18T22:52:03.543 回答