正常情况下,当你向服务器发送数据的时候,你的浏览器将会打开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实现提交表单不刷新页面的更多相关文章

  1. 26.VUE学习之--提交表单不刷新页面,事件修饰符之使用$event与prevent修复符操作表单

    提交表单不刷新页面 <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

  2. 用HTTP状态码实现提交表单后刷新页面不重复提交

    正常情况下,表单提交后如果用户刷新页面会重复提交表单,有些情况下我们不希望表单重复提交,利用HTTP协议中的307状态码重定向页面可以实现这个目的.实例如下: 表单页面代码: <form act ...

  3. 提交form表单不刷新页面案列

    提交form表单不刷新页面其实很简单的,这里拿上传图片来举列,大家有什么其它的方法也欢迎留言告知与我 <form action="" method="post&qu ...

  4. 使用layer的iframe层提交表单后,需要关闭当前的iframe层,然后刷新父页面的方法2

    <input type="button" onclick="edit(${it.id?c})" class="layui-btn layui-b ...

  5. 利用iframe实现提交表单是页面部分刷新

    直接上代码: <%@ page language="java" import="java.util.*" pageEncoding="utf-8 ...

  6. 解决 php提交表单到当前页面,刷新会重复提交 的问题

    http://blog.csdn.net/u012466451/article/details/68952280

  7. ajax提交表单、ajax实现文件上传

    ajax提交表单.ajax实现文件上传,有需要的朋友可以参考下. 方式一:利用from表单的targer属性 + 隐藏的iframe 达到类似效果, 支持提交含有文件和普通数据的复杂表单 方式二:使用 ...

  8. JQuery ajax提交表单及表单验证

    JQuery ajax提交表单及表单验证 博客分类: jsp/html/javascript/ajax/development Kit 开源项目   注:经过验证,formValidator只适合一个 ...

  9. form表单action提交表单,页面不跳转且表单数据含文件的处理方法

    在最近的项目中需要将含 input[type='file']的表单提交给后台 ,并且后台需要将文件存储在数据库中.之前所用的方法都是先将文件上传到七牛服务器上,然后七牛会返回文件的下载地址,在提交表单 ...

随机推荐

  1. SpringBoot引入监听器

    方法一: 实现ServletContextListener ,并添加@WebListener注解 因为ServletContextListener 是由servlet容器管理,游离于spring容器之 ...

  2. 编译安装 nginx php swoole

    安装之前先 准备环境 yum install gcc gcc-c++ automake pcre pcre-devel zlip zlib-devel openssl openssl-devel 然后 ...

  3. 【js】input 焦点到内容的最后

     //引用部分应支持jQuery  function find_focus(obj){    var curr = jQuery(obj);    var val = curr.val();    c ...

  4. python输出mssql 查询结果示例

    # -*- coding: utf-8 -*-# python 3.6import pymssql conn=pymssql.connect(host='*****',user='******',pa ...

  5. Python中的属性访问与描述符

    Python中的属性访问与描述符 请给作者点赞--> 原文链接 在Python中,对于一个对象的属性访问,我们一般采用的是点(.)属性运算符进行操作.例如,有一个类实例对象foo,它有一个nam ...

  6. while else语句

    #else 用于检测循环中间是否有被打断count = 0while count <=5: print('loop',count) count +=1else: print('程序正常执行完毕, ...

  7. python基础学习笔记—— 多继承

    本节主要内容: 1.python多继承 2.python经典类的MRO 3.python新式类的MRO.C3算法 4.super是什么鬼? 一.python多继承 在前⾯的学习过程中. 我们已经知道了 ...

  8. js基础之javascript的存在形式和js代码块在页面中的存放位置和 CSS 对比

    1.存在形式 文件 如: <script src='js/jc.js'></script> 前页面 <script type='text/javascript'>a ...

  9. 基于JQuery的WEB套打设计器jatoolsPrinter1.0

    开发web套打应用时,如快递单打印,一般要经过以下步骤:1. 扫描快递单据,保存成一个图片文件2. 将底图作成<img>3. 在<img>上放置打印项,试着打印到打印机,观察有 ...

  10. perl第三章 列表和数组

    访问数组中的元素    $fred[0]   $fred[1] $number=2.75; print $fred[$number-1]  结果就是print $fred[1] 特殊的数组索引1.对索 ...