php - 我将如何使用 jQuery 复制表单元素和其中的数据？

Question

查看此表格 - http://schnell.dreamhosters.com/form.php

此表单有一部分用于输入数据，您可以通过单击名为“添加站点”的按钮选择添加更多相同的数据，然后该部分的另一部分将进入另一个站点。这是执行复制的 jQuery...

$(function ()   {
    var sites = 1;
    var siteform = $("#site1").html();

    $(".addsites").live("click", function(e) {
        e.preventDefault();
        sites++;
        $("#events").append("<div id='site" + sites + "'>"
            + "<br /><hr><br />"
            + siteform
            + "<center><button class='removesites' title='site"
            + sites + "'>Remove This Site</button><br />"
            + "<button class='addsites'>Add Another Site</button>"
            + "</center></div>");           
    });

    $(".removesites").live("click", function(e) {
        e.preventDefault();
        var id = $(this).attr("title");
        $("#" + id).remove();
    });     
});

复制工作完美，但让我烦恼的一件事是，当我必须为声称拥有大量网站的人输入数据时，不得不重复表格这一部分的相同或相似部分(就像每个网站在同一个城市，同一天，同一个人，等等)所以我的想法是，每次重复时，表单元素的值也会继承，我只是编辑不一样的地方。当前的实现只复制元素，不复制数据。我不确定如何轻松地将数据复制到新部分，而且我找不到任何 jQuery 工具来执行此操作。

PS - 这部分不那么重要，但我也考虑过使用相同的表单将数据加载回以供查看/编辑等。唯一的问题是重新打印表单意味着将有一个 ID 为“Site7”之类的表单部分，但 jQuery 始终从 1 开始编号。我考虑过使用选择器来查找最高编号的站点并从该编号处开始变量“站点”，但我不确定该怎么做。非常感谢任何关于如何做到这一点的建议，或者更好的系统。

Answer 1

您想迭代站点表单中的输入字段并将它们存储在一个对象中，使用它们的名称属性作为键。

然后在复制您创建的对象后，在新复制的表单中查找等效字段并设置它们的值。

类似这样的东西(未经测试，只是想法)

var obj = new Object();

$("#site1 input").each(function(){
    obj[this.id] = this.value;
);

// Dupicate form

$.each(obj, function(key, value){
    $('#newform input[name="'+key+'"]').value = value;
});

请注意，这两个 each() 函数彼此不同。

http://api.jquery.com/jQuery.each/http://api.jquery.com/each/