form隐藏提交

最新推荐文章于 2024-07-31 17:27:46 发布

原创最新推荐文章于 2024-07-31 17:27:46 发布 · 814 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#Ajax

技术专栏收录该内容

5 篇文章

订阅专栏

本文介绍了一种使用HTML表单实现隐藏提交的方法。通过设置表单的目标为一个不可见的iframe，可以实现在不跳转页面的情况下提交表单。适用于需要保持当前页面状态但又需要提交数据的场景。

form怎么实现隐藏提交呢？先请看下面的代码


<HTML>
<HEAD>
<TITLE> 隐藏提交</TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<BODY>
<form action="submit.do" target="iframe1">
<TABLE>
<TR>
	<TD><input type="text" name="name" value="123"></TD>
</TR>
<TR>
	<TD><input type="button" name="name" value="提交" onclick="submitBut()"></TD>
</TR>
</TABLE>
</form>
<iframe name="iframe1" width="0" height="0">
</BODY>

<SCRIPT LANGUAGE="JavaScript">
<!--
function submitBut(){
     document.forms[0].submit();
}
//-->
</SCRIPT>
</HTML>

原理如下：将form的target设置为页面上一个长、宽都是0的iframe，这样点击提交按钮后页面会提交到这个iframe里面，但是页面不会转向，看着像是用了ajax。

今天，做页面的时候遇到了另外的情况，页面上有个iframe1，iframe1里面的页面要实现隐藏提交，用了以上说的方法，点提交后iframe1总是转向。最后让iframe1里面的页面提交到iframe1所在页面的iframe2解决问题了