Question

我的HTML结构是这样的：

<div>
  <input type="text" name="array[a][b][0][foo]" />
  <input type="text" name="array[a][b][0][bar]" />
  <select name="array[0][a][b][baz]>...</select>
</div>

元素值通过POST提交并由PHP处理。 select元素附加了change个事件，clones父级div并将其附加到下方。

当克隆div时，元素的名称仍然相同，并且值会相互覆盖，我不希望这种情况发生。所有array[a][b]元素都是数组类型，因此我不能简单地使用array[a][b][]（不再对foo / bar / baz值进行分组）。

解决这个问题的最佳方法是在克隆时更改名称？这意味着索引需要递增。我不能在这里使用简单的el.name.replace(N, N + 1)，因为名称可能多次出现N.

Answer 1

您可以将一个类命名为父<div>，当您克隆时，可以使用该类名进行。

<div class="a">
  <input type="text" name="array[a][b][0][foo]" />
  <input type="text" name="array[a][b][0][bar]" />
  <select name="array[0][a][b][baz]>...</select>
</div>
<div class="a">
  <input type="text" name="array[a][b][1][foo]" />
  <input type="text" name="array[a][b][1][bar]" />
  <select name="array[1][a][b][baz]>...</select>
</div>

然后，在你的javascript中你可以这样做：

var n = $('.a').length;

这使用jquery返回2，你可以使用替换函数。

使用Javascript / jQuery的动态元素名称属性

1 个答案: