0

在php中我有以下数组

$var=array();
$var[0][0][num]='1';
$var[0][0][text]='2';
$var[0][1][num]='3';
$var[0][1][text]='4';
$var[1][0][num]='5';
$var[1][0][text]='6';
$var[1][1][num]='7';
$var[1][1][text]='8';

我需要上下移动变量对[text]并将[num]新对附加到数组的末尾。

在服务器端做这件事很简单,但我想在客户端允许这些操作。

所以,它应该如下所示

<form>
<div>
<input name="var[0][0][num]" value="1">
<input name="var[0][0][text]" value="2">
<input name="var[0][1][num]" value="3">
<input name="var[0][1][text]" value="4">
</div>

<div>
<input name="var[1][0][num]" value="5">
<input name="var[1][0][text]" value="6">
<input name="var[1][1][num]" value="7">
<input name="var[1][1][text]" value="8">
</div>
</form>

所以,现在我需要将这些 div 中的任何一个复制到表单的末尾并上下移动这些 div 并保持它们的值。

例如,我可以复制上层 div 并将其附加到form

onlick="this.parentNode.appendChild(this.cloneNode(true))"

之后的表格如下所示:

<form>
<div onlick="this.parentNode.appendChild(this.cloneNode(true))">
<input name="var[0][0][num]" value="1">
<input name="var[0][0][text]" value="2">
<input name="var[0][1][num]" value="3">
<input name="var[0][1][text]" value="4">
</div>

<div>
<input name="var[1][0][num]" value="5">
<input name="var[1][0][text]" value="6">
<input name="var[1][1][num]" value="7">
<input name="var[1][1][text]" value="8">
</div>

<div onlick="this.parentNode.appendChild(this.cloneNode(true))">
<input name="var[0][0][num]" value="1">
<input name="var[0][0][text]" value="2">
<input name="var[0][1][num]" value="3">
<input name="var[0][1][text]" value="4">
</div>

</form>

我不知道如何更改复制的 div 输入的名称。例如,复制和附加的 div 应该是

<div onlick="this.parentNode.appendChild(this.cloneNode(true))">
<input name="var[2][0][num]" value="1">
<input name="var[2][0][text]" value="2">
<input name="var[2][1][num]" value="3">
<input name="var[2][1][text]" value="4">
</div>

或者,当我将上 div 移动到下 div 下方时,它们应该被重命名并且看起来像

<div>
<input name="var[0][0][num]" value="5">
<input name="var[0][0][text]" value="6">
<input name="var[0][1][num]" value="7">
<input name="var[0][1][text]" value="8">
</div>

<div>
<input name="var[1][0][num]" value="1">
<input name="var[1][0][text]" value="2">
<input name="var[1][1][num]" value="3">
<input name="var[1][1][text]" value="4">
</div>

好的,我知道这个问题很复杂,可能看起来甚至很愚蠢,所以我至少需要猜测一下 =)

4

1 回答 1

1

你没有在你的标签中提到 jQuery,但这就是我要看的。具体来说,jQueryUI 库,它运行在 jQuery 之上。

jQuery 是一个 javascript 库,它比经典 javascript 更高效(更少的输入,用更少的代码做更多的事情)。

请参阅此处的 jQueryUI 可排序小部件。

jQuery 教程:thenewboston.com 上的 Alex Garret 的 jQuery 教程

Alex Garret 的网站有更多教程。

于 2013-08-23T15:22:41.460 回答