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

更新时间：2016年11月30日 09:20:01 作者：limeiky

本文介绍了如何通过js实现表单提交后不重新刷新当前页面的方法实例.既提交了FORM保存了数据,页面也不会跳转，很实用。需要的朋友可以参考下

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

<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保存了数据,页面也不会跳转.

以上就是本文的全部内容，希望对大家有所帮助，同时也希望多多支持脚本之家！

您可能感兴趣的文章:

响应式框架Bootstrap栅格系统的实例
下面小编就为大家分享一篇响应式框架Bootstrap栅格系统的实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2017-12-12
一文解析JavaScript模块构建的三种方式
在现代Web开发中,JavaScript库的构建和打包是一个至关重要的环节,不同的构建方式可以影响到库的性能、可维护性和适用性,本文将深入剖析三种主要的JavaScript模块构建方式：CommonJS、ES模块和AMD,我们将深入探讨它们的工作原理、适用场景以及示例代码
2023-08-08
Nodejs使用mysql模块之获得更新和删除影响的行数的方法
业余时间玩nodejs的时候遇到点蛋疼的情况, 在使用mysql模块连接mysql操作, 想在update, delete语句的时候, 想知道到底update, delete成功了没有
2014-03-03
浅析JS中回调函数及用法
这篇文章主要介绍了JS中回调函数及用法，通过实例代码给大家详细介绍了什么是回调函数，非常不错，具有一定的参考借鉴价值，需要的朋友参考下吧
2018-07-07
JS实现网站换肤
这篇文章主要为大家详细介绍了JS实现网站换肤，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2022-07-07
兼容FireFox 用javascript写的一个画图函数
兼容FireFox 用javascript写的一个画图函数...
2007-08-08
javascript循环变量注册dom事件之强大的闭包
是在循环过程过this被改变，注册过的事件也被随之改变，找到了一种解决方法
2010-09-09
JavaScript中的isXX系列是否继续使用的分析
我们很容易被漂亮的代码吸引，也不知不觉的在自己的代码库中加入这些。却没有冷静的想过它们的优劣。这不，我就收集了一系列形如 “是否为……？” 的判断的boolean函数。
2011-04-04
教你用typescript类型来推算斐波那契
斐波那契是自然界与社会中存在的一种数学规律,下面这篇文章主要给大家介绍了关于如何用typescript类型来推算斐波那契的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
2022-01-01
微信小程序制作表格的方法
这篇文章主要为大家详细介绍了微信小程序制作表格的方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2019-02-02