jquery - 用户选择在 jQuery 克隆中丢失？

Question

背景对于理解这个问题来说并不是那么必要，但是我想要做的事情的基本想法是:我有一个包含可以展开、编辑和再次折叠的各个部分的表单，以及该表单的状态每次都会记住表单字段。我想为用户提供“取消”更改的能力 - 如果用户展开一个部分并进行更改，但随后决定恢复到以前的表单部分(在展开之前)，他们可以单击“取消”并字段将全部恢复。 (这本质上是一个“撤消”/回滚按钮。)我通过使用 jQuery clone 在扩展时克隆表单部分来实现这一点，如果用户点击“取消”，我将替换更新的表单与原始克隆的部分。

问题是用户选择的“select”元素似乎没有包含在克隆中。我构建了一个基本的 jsfiddle为了演示这一点 - 如果您尝试在任一部分中选择某些内容然后克隆它，则会在没有选择的情况下克隆它。

有什么办法可以绕过这个限制吗？除了克隆之外，我还应该使用其他方法吗？

我假设我可以手动编写一个循环来复制所有选择的所有选定值，但这相当hacky。有更顺畅的方法来处理这个问题吗？

Answer 1

根据你的 fiddle :

$(function(){
    $('#sec1Clone').click(function(){
        $("#sec1 select option:selected").attr("selected", true);
        $('#sec1').clone(true).attr('id', 'cloneOfSec1').appendTo(document.body);
    });
     $('#sec2Clone').click(function(){
         $("#sec2 select option:selected").attr("selected", true);
        $('#sec2').clone(true).attr('id', 'cloneOfSec2').appendTo(document.body);
    });
});

如果这是一个可接受的解决方案，那么这似乎可行。