这是我在StackOverflow上提出的第一个问题，所以，首先，我要感谢所有人，你们在这里建立了如此庞大的知识库：）
我正在构建一个由4个部分组成的表单，每个部分都有特定的输入。该表单还有一些其他字段，这些字段根据您之前的答案动态显示或隐藏（例如，如果您从单选按钮中选择“是”，其中显示“是否有其他人拥有超过5％的业务？ “，将使用.show（）弹出一个名为'partner_information'的新字段集，其中包含有关合作伙伴属性的一些特定信息：名字，姓氏，电子邮件和业务百分比。”
此字段集还有一个“添加另一个伙伴”按钮，该按钮克隆“partner_attributes”字段集并为克隆分配特定ID。克隆部分的代码是：
var cloneCount = 2;
$(document).on('click',
".userBackendAddAnotherPartnerCTALink",
function () {
$('[id^=partner-information]:last').clone().attr('id', 'partner-information-'+ cloneCount++).insertAfter($('[id^=partner-information]:last')).find("input").val("").attr("name",function(i,oldVal) {
return oldVal.replace(/\[(\d+)\]/,function(_,m){
return "[" + (+m + 1) + "]";
});
});
});
当我更改表单的部分或刷新页面时出现问题：由于这是一个非常复杂和冗长的表单，我希望用户能够在表单部分中前进和后退，完成他们想要的信息在他们每个人中，并且能够在提交表格之前回来并完成所有信息。
说到这一点，你可以想象我的主要问题是当用户点击“添加另一个伙伴”，克隆partner_attributes字段集，完成有关合作伙伴属性的所有字段，然后转到另一部分时：如果他们返回到更改页面后的合作伙伴部分，克隆的字段集已经消失，因为DOM已经刷新。
该应用程序在Rails 4中运行，以防该信息对您有用。下面是触发partner_attributes字段集的.show（）和.hide（）jQuery方法的单选按钮的代码：
<!-- input more than 5% of the business -->
<div class="userBackendAFInputContainer col-lg-6 col-md-6 col-sm-6 col-xs-6">
<!-- label -->
<label for="more-than-5" class="userBackendAFLabel">Is there anyone else who owns more than 5% of the business?</label>
<!-- label -->
<!-- yes -->
<div class="userBackendAFRadioBtnContainer">
<!-- input -->
<input type="radio" name="loan_application[partners_attributes][]" value="yes" id="more-than-5-yes" class="userBackendAFRadioButtons" <%= 'checked' if @loan_application.partners.any? %> ><span></span>
<!-- input -->
<!-- label -->
<label class="userBackendRadioButtonsTxt" for="more-than-5-yes">Yes</label>
<!-- label -->
</div>
<!-- yes -->
<!-- no -->
<div class="userBackendAFRadioBtnContainer">
<!-- input -->
<input type="radio" name="loan_application[partners_attributes][]" value="no" id="more-than-5-no" class="userBackendAFRadioButtons" <%= 'checked' if @loan_application.partners.empty? %> ><span></span>
<!-- input -->
<!-- label -->
<label class="userBackendRadioButtonsTxt" for="more-than-5-no">No</label>
<!-- label -->
</div>
<!-- no -->
</div>
<!-- input more than 5% of the business -->
<!-- clear -->
<div class="clearFix"> </div>
<!-- clear -->
在这里，要克隆的字段集：
<!-- fieldset partner information -->
<fieldset class="userBackendAFFormFieldset userBackendPartnerInformation" id="partner-information">
<!-- title partner information -->
<h5 class="userBackendAFFieldsetTitle col-lg-12 col-md-12 col-sm-12 col-xs-12">partner information</h5>
<!-- title partner information -->
<!-- clearfix -->
<div class="clearFix"> </div>
<!-- clearfix -->
<!-- input partner first name -->
<div class="userBackendAFInputContainer col-lg-6 col-md-6 col-sm-6 col-xs-6">
<!-- label -->
<label for="partner-first-name" class="userBackendAFLabel">First Name</label>
<!-- label -->
<!-- input -->
<input type="text" class="userBackendAFInput" id="partner-first-name"
name="loan_application[partners_attributes][1][partner_first_name]" placeholder="Charles"
value="<%= @loan_application.partners['1'].try(:[], 'partner_first_name') %>" />
<!-- input -->
</div>
<!-- input partner first name -->
<!-- input partner last name -->
<div class="userBackendAFInputContainer col-lg-6 col-md-6 col-sm-6 col-xs-6">
<!-- label -->
<label for="partner-last-name" class="userBackendAFLabel">Last Name</label>
<!-- label -->
<!-- input -->
<input type="text" class="userBackendAFInput" id="partner-last-name"
name="loan_application[partners_attributes][1][partner_last_name]" placeholder="Estrada"
value="<%= @loan_application.partners['1'].try(:[], 'partner_last_name') %>" />
<!-- input -->
</div>
<!-- input partner last name -->
<!-- clear -->
<div class="clearFix"> </div>
<!-- clear -->
<!-- input partner email -->
<div class="userBackendAFInputContainer col-lg-6 col-md-6 col-sm-6 col-xs-6">
<!-- label -->
<label for="partner-email" class="userBackendAFLabel">Email</label>
<!-- label -->
<!-- input -->
<input type="email" class="userBackendAFInput" id="partner-email"
name="loan_application[partners_attributes][1][partner_email]" placeholder="oberbrunner_dianna@leffler.net"
data-parsley-trigger="change" value="<%= @loan_application.partners['1'].try(:[], 'partner_email') %>" />
<!-- input -->
</div>
<!-- input partner email -->
<!-- input partner percentage of business container -->
<div class="userBackendAFInputContainer col-lg-6 col-md-6 col-sm-6 col-xs-6">
<!-- label -->
<label for="partner-percentage-business" class="userBackendAFLabel">Percentage of the business</label>
<!-- label -->
<!-- input -->
<input type="text" class="userBackendAFInput" id="partner-percentage-business"
name="loan_application[partners_attributes][1][partner_percentage]" placeholder="%100"
data-parsley-type="number" value="<%= @loan_application.partners['1'].try(:[], 'partner_percentage') %>" />
<!-- input -->
</div>
<!-- input partner percentage of business container -->
<!-- clearfix -->
<div class="clearFix"> </div>
<!-- clearfix -->
</fieldset>
<!-- fieldset partner information -->
<!-- add another partner cta -->
<div class="userBackendAddAnotherPartnerCTA">
<span class="userBackendAddAnotherPartnerCTALink">+ add another partner</span>
</div>
<!-- add another partner cta -->
提前感谢您的帮助！如果您需要更多信息以解决此问题，请与我们联系。
答案 0 :(得分：0)
你不能以这种方式持久保存克隆元素，因为这些元素被动态地添加到DOM中，它们总是会在刷新时擦除。您最好的选择是使用rails查看持久化数据到模型中，然后根据给定会话是否保存数据来加载表单数据并在页面加载上构建表单。