html form表单提交后不刷新不跳转的实现方法------

时间：2021-04-20 19:41:25


[html]   view plain  copy
  1. <html>    
  2.   <body>    
  3.       
  4.   <form action="" method="post" target="nm_iframe">    
  5.       <input type="text" id="id_input_text" name="nm_input_text" />    
  6.       <input type="submit" id="id_submit" name="nm_submit" value="提交" />    
  7.   </form>    
  8.       
  9.   <iframe id="id_iframe" name="nm_iframe" style="display:none;"></iframe>    
  10.       
  11.   </body>    
  12.   </html>    

在默认情况下， 提交form表单后， 是有刷新的。 但是， 有的时候， 希望提交表单后不要刷新， 免得把页面已经有的东东给刷跑了， 那怎么搞呢（最近刚好碰到）？ 实例代码在上。

经测试， 实现了功能。 点击提交后， 不跳转， 不刷新， 靠谱。  其中， action可以设置为要触发的动作， 在本例中， 我写成空。



 
如何实现表单提交后不重新刷新当前页面

<form name='form1' id='form1' action='/xbcw/cw/xx_xx.action' method='post'>

　　<input type="button" id="btnSubmit" name="btnSubmit" value="保存" onclick="addKp()" class="Button2" />

　　<input type="button" id="btnSubmit" name="btnSubmit" value="下一步" onclick="doAddCwKpSubmit()" class="Button2" />

</form>


当我点击保存提交FORM表单后,如何让当前页面维持不变(即不刷新当前页)？

在FORM表单后添加一个iframe

　　<iframe id="rfFrame" name="rfFrame" src="about:blank" style="display:none;"></iframe> 


点保存提交事件里面需要将target改为iframe的名字:

　　JS:document.forms[0].target="rfFrame";

JQuery:$("#f2").attr("target","rfFrame");



这样即提交了FORM保存了数据,页面也不会跳转.


标签：

相关文章