場景：主表 : 附表 = 1 : m，同一個頁面，共同使用一個保存按鈕進行兩個表的數據保存，頁面中間有個查詢按鈕，可以對子iframe頁面的內容進行刷新

流程項目頁面內嵌了個子iframe，項目頁面表單數據提交保存是一個主表（loan_item_apply），內嵌iframe中的列表數據需要存儲于附表中（loan_item_apply_funding）

方案：點擊保存時，獲取子iframe，將子iframe中需要保存的數據以隱藏域的方式拼接到父窗口的form下方，由于子iframe中的數據是列表數據，所以需要在loan_item_apply表對應的映射類里面添加loan_item_apply_funding表的映射類列表屬性

LoanItemAppply類

private List<LoanItemApplyFunding> fundingList;

獲取子iframe中form表單的屬性和值并拼接隱藏域于父窗口的form下方

// 調用子iframe中的方法，校驗資金方是否使用完成
var iframeWindow = document.getElementById("fundingIframe").contentWindow;
var isFinishUseMoney = iframeWindow.checkFundingMoney(); // 在父窗口中調用子iframe內的functionif (!isFinishUseMoney){return;}else{ // 在form表單中拼接項目-資金方存表的相關信息const form = document.getElementById("loanItemApplyForm"); // 父窗口表單formconst table = iframeWindow.document.getElementById("loanItemApplyFundingListDetail"); // 子iframe里的form里面的列表屬性const rows = table.querySelectorAll("tr");for (let i = 1; i < rows.length; i++) { // 獲取第二個tr及后續的trconst row = rows[i];// 檢查復選框選中的rowconst checkbox = row.querySelector("input[type='checkbox']");if (null != checkbox){if (checkbox.checked) { // 遍歷選中已勾選的tr// 獲取所有input標簽內容并新增input隱藏域拼接在form表單后面const inputs = row.querySelectorAll("input");inputs.forEach((input) => {const hiddenInput = document.createElement("input");hiddenInput.type = "hidden";hiddenInput.name = input.name;hiddenInput.value = input.value;form.appendChild(hiddenInput);});// 獲取所有select標簽內容并新增input隱藏域拼接在form表單后面const selects = row.querySelectorAll("select");selects.forEach((select) => {const hiddenInput = document.createElement("input");hiddenInput.type = "hidden";hiddenInput.name = select.name;hiddenInput.value = select.value;form.appendChild(hiddenInput);});}}}}

子iframe中form里面的列表屬性展示

<!-- foreach循環遍歷后端傳過來的list -->
<tr><!-- input框 --><td><input type="checkbox" class="pk" name="fundingList[${item.index}].屬性名"id="fundingList[${item.index}].屬性名" value="${fundingList元素中對應的屬性值}" /></td><!-- select下拉框 --><td><select id="fundingList[${item.index}].屬性名" name="fundingList[${item.index}].屬性名" value="${fundingList元素中對應的屬性值}"><!-- 循環遍歷下拉框選項optionList --><option value="${optionList元素中對應的屬性值}">${optionList元素中對應的屬性值}</option></select></td>
</tr>