我试图提交一份有点长的表格,并通过几个“页面”分发,“提交”按钮不会发送表格。
<div data-role="page">
<form action="save_data.php">
<input type="text">
<a href="#two">next</a>
</div>
<div data-role="page" id="#two">
<input type="text">
<input type="text">
<a href="#three">next</a>
</div>
<div data-role="page" id="#three">
<input type="text">
<input type="submit">
</div>
如果我将<form action="save_data.php">
放在与提交相同的页面中,则会发送数据,否则不会发生任何事情。
我只能在同一个“页面”中发送表单,即使它们实际上都是同一个文件吗?
由于
答案 0 :(得分:2)
除了最后一个表单页面之外的所有页面都执行以下操作:
var $lastPageForm = $('.last-page').find('form');
$('.not-last-page').find('form').on('submit', function () {
$.each($(this).find('input'), function () {
$lastPageForm.append($(this).clone());
});
return false;
});
这将克隆第一个表单中的每个input
,并将这些克隆附加到最后一个表单。这样,所有表格的所有输入都会在最后一页上同时提交。
此代码需要一个多页面模板,如下所示:
<div class="not-last-page" data-role="page">
<form>
<input type="text">
<a href="#two">next</a>
</form>
</div>
<div class="not-last-page" data-role="page" id="two">
<form>
<input type="text">
<a href="#three">next</a>
</form>
</div>
<div class="last-page" data-role="page" id="three">
<form action="save_data.php">
<input type="text">
<input type="submit" />
</form>
</div>