使用iframe实现提交表单不刷新页面
正常情况下,当你向服务器发送数据的时候,你的浏览器将会打开action页面,并且不会重回到当前页面。但是有的时候,我们因为各种各样的要求,而不希望浏览器在提交数据的时候去刷新当前的页面或者转向到新的页面。
所以我们引入一个嵌入框架来解决这个问题。具体的原理是:当表单在提交数据的时候,不将提交目标设置为当前的页面,而是当前页面中的一个嵌入框架。
首先你应该在body下面插入一个嵌入框架:
<iframe style="width:0; height:0; margin-top:-10px;" name="submitFrame" src="about:blank"></iframe>
然后你应该设置表单的目标为这个嵌入框架,比如这样:
<form name="testform" method="post" action="apply.cgi" target="submitFrame">
<input type="submit" value="提交" />
</form>
form的target和iframe的name绑定。
使用iframe实现提交表单不刷新页面的更多相关文章
- 26.VUE学习之--提交表单不刷新页面,事件修饰符之使用$event与prevent修复符操作表单
提交表单不刷新页面 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...
- 用HTTP状态码实现提交表单后刷新页面不重复提交
正常情况下,表单提交后如果用户刷新页面会重复提交表单,有些情况下我们不希望表单重复提交,利用HTTP协议中的307状态码重定向页面可以实现这个目的.实例如下: 表单页面代码: <form act ...
- 提交form表单不刷新页面案列
提交form表单不刷新页面其实很简单的,这里拿上传图片来举列,大家有什么其它的方法也欢迎留言告知与我 <form action="" method="post&qu ...
- 使用layer的iframe层提交表单后,需要关闭当前的iframe层,然后刷新父页面的方法2
<input type="button" onclick="edit(${it.id?c})" class="layui-btn layui-b ...
- 利用iframe实现提交表单是页面部分刷新
直接上代码: <%@ page language="java" import="java.util.*" pageEncoding="utf-8 ...
- 解决 php提交表单到当前页面,刷新会重复提交 的问题
http://blog.csdn.net/u012466451/article/details/68952280
- ajax提交表单、ajax实现文件上传
ajax提交表单.ajax实现文件上传,有需要的朋友可以参考下. 方式一:利用from表单的targer属性 + 隐藏的iframe 达到类似效果, 支持提交含有文件和普通数据的复杂表单 方式二:使用 ...
- JQuery ajax提交表单及表单验证
JQuery ajax提交表单及表单验证 博客分类: jsp/html/javascript/ajax/development Kit 开源项目 注:经过验证,formValidator只适合一个 ...
- form表单action提交表单,页面不跳转且表单数据含文件的处理方法
在最近的项目中需要将含 input[type='file']的表单提交给后台 ,并且后台需要将文件存储在数据库中.之前所用的方法都是先将文件上传到七牛服务器上,然后七牛会返回文件的下载地址,在提交表单 ...
随机推荐
- 【dp】石子归并
玄学NPC 题目描述 有一堆石头质量分别为W1,W2,…,Wn.(Wi≤10000),将石头合并为两堆,使两堆质量的差最小. 输入 输入第一行只有一个整数n(1≤n≤50),表示有n堆石子.接下去的n ...
- Linux常用文档操作命令--2
4.文档压缩与解压操作 在Linux中常见的压缩文件有:*.tar.gz.*.tgz.*.gz.*.Z.*bz2等.其每种不同的压缩文件对印的压缩和解压命令也不同. *.tar.gz :tar程序打包 ...
- 逃离迷宫 HDU - 1728(bfs)
逃离迷宫 Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Submis ...
- bootstrap 弹出框(Popover)插件 修改title等属性选项值
<button type="button" class="btn btn-default ht-btn" data-toggle="popove ...
- dotnet core 运行程序注意事项
.net core 程序 debug版本无法直接运行,因为没有相关的dll,只有在进入项目文件夹那一层,执行 dotnet run 来运行,会自动链接 当前用户的个人文件夹下的 .nuget/.pac ...
- Maven本地库在哪?
Maven的本地存储库是一个本地文件夹,用于存储你的所有项目的依赖项(插件Jars和其他Maven下载的文件).简单的说,当你建立一个Maven项目,所有依赖文件将存储在Maven的本地库. 默认情况 ...
- dev c++ 提示没有iostream.h文件
dev c++ 提示没有iostream.h文件 解决办法路径没有打通最好是这样写:#include <iostream>using namespace std;int main(int ...
- 如果奇迹有颜色,那么一定是暴力or模拟比较6
模拟就是一个思想,给你一个东西,没有很好的算法去解决,只需要计算机去暴力,优雅的暴力就可以叫算法了 主要还是考大家的代码能力,这次题目应该不需要任何前置技能. 1001 Time Limit(Comm ...
- TOJ1840: Jack Straws 判断两线段相交+并查集
1840: Jack Straws Time Limit(Common/Java):1000MS/10000MS Memory Limit:65536KByteTotal Submit: 1 ...
- 2017ICPC北京 J:Pangu and Stones
#1636 : Pangu and Stones 时间限制:1000ms 单点时限:1000ms 内存限制:256MB 描述 In Chinese mythology, Pangu is the fi ...