在提交父表格内的表格时,可以使用以下方法:
<form method="POST" action="submit.php">
<!-- 父表格 -->
<table>
<!-- 父表格内容 -->
</table>
<!-- 子表格 -->
<table>
<!-- 子表格内容 -->
</table>
<!-- 提交按钮 -->
<input type="submit" value="提交">
</form>
<tr>
<td>
<input type="hidden" name="child_data[]" value="子表格数据1">
子表格数据1
</td>
</tr>
<tr>
<td>
<input type="hidden" name="child_data[]" value="子表格数据2">
子表格数据2
</td>
</tr>
</table>
<?php
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
// 获取父表格数据
$parent_data = $_POST['parent_data'];
// 获取子表格数据
$child_data = $_POST['child_data'];
// 处理数据,例如存储到数据库
// ...
}
?>
// 获取表单元素
const form = document.querySelector('form');
// 监听表单提交事件
form.addEventListener('submit', (event) => {
// 阻止默认提交行为
event.preventDefault();
// 获取表单数据
const formData = new FormData(form);
// 发送AJAX请求
fetch(form.action, {
method: form.method,
body: formData
})
.then(response => response.json())
.then(data => {
// 处理响应数据
console.log(data);
})
.catch(error => {
// 处理错误
console.error(error);
});
});
注意:在实际开发中,为了提高安全性,建议对提交的数据进行验证和过滤,防止恶意注入攻击。
领取专属 10元无门槛券
手把手带您无忧上云