在網(wǎng)頁(yè)開(kāi)發(fā)中我們可能會(huì)經(jīng)常遇到一個(gè)form表單中出現(xiàn)一個(gè)文件上傳form或者其他的form，不幸的是瀏覽器在解析的時(shí)候會(huì)只保留最外層的那一個(gè)，這會(huì)使得中間的form無(wú)法提交的問(wèn)題出現(xiàn)，

下面是一種解決辦法

<!--數(shù)據(jù)提交 所需要的form-->

<form id='mForm' method="post" target='frameFile' action="/controllers/orderManage/saveMaterial.php">
<table cellpadding="0" cellspacing="0" border="0" width="100%" class="dd_table mt20 b_t">
<tbody>
<tr id="{#$m['fld_ID']#}">
<td>普通素材</td>
<td>
<div class="over_hide fl formdiv">
<div class="file_input">

<!--文件上傳 所需要的form-->
<input class="file_input1 fileUp" disabled type="file" name="file_{#$m['fld_ID']#}" />
<input type="hidden" name="allowSize" value='{#$allowSize#}'/>
<input type="hidden" name="mid" value="{#$m['fld_ID']#}"/>
</div>
</div>
<span class="fl fil_span">{#$imgNames[$m['fld_ID']]#}</span>
</td>
<td>
<p>{#$format[$m['fld_Type']]#}</p>
<input type="hidden" name="format_{#$m['fld_ID']#}" value={#$m['fld_Type']#} />
<input type="hidden" name="ext_{#$m['fld_ID']#}" value="{#$exts[$m['fld_ID']]#}" />
<input type="hidden" name="fileSize_{#$m['fld_ID']#}" value="{#$m['fld_Size']#}" />
</td>
<td class="pr">
<a href="javascript:;" class="bread_c selectCate">素材類(lèi)型</a>
<div class="tc_file" style='display:none;'>
<a href="javascript:;" class="tc_sclose closeCate"></a>
<table cellpadding="0" cellspacing="0" border="0" width="100%" class="table_no mt20">
<tr>
<td class="tar">素材分類(lèi):</td>
<td class="tal">
<select class="sel fl mr10 bdcategory" style="width:137px;">
<option value='0'>一級(jí)分類(lèi)</option>
{#foreach from=$categoryList item=t#}
<option value="{#$t['bdcat']#}">{#$t['name']#}</option>
{#/foreach#}
</select>
<select name="childCate_{#$m['fld_ID']#}" class="sel fl childCate" style="width:137px;">
<option value='0'>二級(jí)分類(lèi)</option>
</select>
</td>
<td></td>
</tr>
</tbody>
</table>
</form>

<!--提取中間的form在最外層-->

<form id='publicForm' name='formFile' method="post" action="/controllers/orderManage/upload.php" target='frameFile' enctype="multipart/form-data">
</form>

<!--jquery實(shí)現(xiàn)-->

$('.fileUp').bind('change', function(){
$('#publicForm').append($(this).parent().children());
$('#publicForm').submit();
})

?

整體思路：就是把單獨(dú)提交的數(shù)據(jù)提取到一個(gè)公用的from中單獨(dú)提交，文件上傳也可已使用。

轉(zhuǎn)載于:https://www.cnblogs.com/dilei/p/4667261.html

總結(jié)

以上是生活随笔為你收集整理的html from嵌套from的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。