form表单无刷新提交
Ajax最大的特点就是可以不刷新页面而实现数据的通信及更改页面信息。那么用AJAX进行后台通信传递字符串还是可以的,遇到上传文件该怎么办呢?基于安全考虑,JS是不能直接进行文件操作的,只好用原始的from来提交文件上传了。这样一来,用form不就要刷新页面了吗?其实也不是。
给我们的from加一个target属性,并且将这个属性的值设置为隐藏的iframe的ID,这样一来,刷新的页面是我们隐藏的iframe,我们的页面就不会刷新了。这个方法,时广大前辈的知识和经验的结晶,我是不费吹灰之力拿来用了,站在巨人的肩膀上。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>AjaxUpload</title>
</head>
<body onLoad="javascript:alert('onload')" onUnload="javascript:alert('onunload')">
<form name="AjaxUpload" method="post" action="upload.jsp" target="hidden_frame">
<input type="submit" name="Submit" value="提交">
</form>
<iframe name='hidden_frame' id="hidden_frame" style="display:none"></iframe>
</body>
</html>
form表单无刷新提交的更多相关文章
- form表单无刷新提交文件(iframe)
先看一段代码(PHP例子) 1.表单代码(form.html): <iframe name="testIframeName" style="display:none ...
- $_FILES参数详解及简单<form>表单无刷新上传文件
$_FILES:经由 HTTP POST 文件上传而提交至脚本的变量,类似于旧数组$HTTP_POST_FILES 数组(依然有效,但反对使用)详细信息可参阅 POST方法上传 $_FILES数组内容 ...
- FORM表单不刷新提交POST数据
很多时候表单太多项,JQ懒的去处理了 使用这个提交吧.和她讨论出去旅游,去哪里好呢,此时还和以前一样吗? function testaction(){ var f = $("#publish ...
- 提交form表单不刷新页面案列
提交form表单不刷新页面其实很简单的,这里拿上传图片来举列,大家有什么其它的方法也欢迎留言告知与我 <form action="" method="post&qu ...
- 防止表单提交时刷新页面-阻止form表单的默认提交行为
最近在写 ajax 提交的时候遇到一个问题,在执行 ajax 提交之后,浏览器页面自动刷新了,主要是没有 由于form 表单的默认提交行为.一下是几种阻止 form 表单默认提交行为的方式. 1.使用 ...
- form表单两种提交方式的不同
我们在使用<Form>表单的时候,最常用的提交方式就是Get和Post.我们都知道这两种方式最大的差别就是安全性,除此之外,它们还有哪些其他的区别,你知道吗? 在<Form& ...
- Form表单三种提交按钮的区别?
1.<input type='button' id='btn' onclick='check()' value="提交"> 说明:只是普通的按钮(不附带提交功能),不会 ...
- form表单input回车提交问题
问题:文本框输入完成后点击回车页面刷新问题出在form上,当表单中只有一个文本框的时候获取焦点并点击回车之后会提交表单内容,就会发生刷新事件. 解决方法: 1.增加一个隐藏的输入框 <input ...
- form 表单跨域提交
<!DOCTYPE html><html> <head> <title>form 表单上传文件</title> <script src ...
随机推荐
- 基于【 centos7】二 || 系统时间与网络时间同步
# date // 查看系统时间 #hwclock // 查看硬件时间 # yum -y install ntp ntpdate 安装ntpdate工具 # ntpdate cn.pool.ntp.o ...
- 【算法】php实现排序(一)
选择排序方式:先让第一位与其他位比较大小找到最小的数字,然后是第二位与除第一位的其他位比较大小找出第二位,依此类推 $arr = [2,45,12,67,33,5,23,132,46]; for ($ ...
- 运行 jar 的问题
lib stwe.jar 同目录
- 1249: 人见人爱A^B
题目描述 求A^B的最后三位数表示的整数. 说明:A^B的含义是“A的B次方” 输入 输入数据包含多个测试实例,每个实例占一行,由两个正整数A和B组成(1<=A,B<=10000),如果 ...
- 【Zookeeper】 在Java中的操作
一.基本功能演示 1.1 Maven依赖信息 1.2 代码演示 方法说明 1.3 创建Zookeeper节点信息 二.Watcher 2.1 什么是Watcher接口 2.2 Watcher代码 一. ...
- 【转】ufw 端口
1.扫描端口 用ubuntu自带的网络工具中的端口扫描不够强大,扫描结果可能不全,推荐用nmap,黑客常用的端口扫描利器!安装方法:sudo apt-get install nmap ,想扫描端口nm ...
- C++ ---释放内存(new和delete)
C++ ---释放内存(new和delete) C++动态分配和释放内存 @c.biancheng.net/view/206.html -------------------------------- ...
- Selenium(九)测试用例数据分离与从文件导入数据
一.测试用例数据与代码分离 1.从之前的脚本来看,我还是把数据写在了脚本中,这样脚本的通用性很差.全局的数据其实可以从数据库.文本文件.Excel中直接读取. 2.代码和用户数据分离: 3.数据设计- ...
- SpringMVC 一次请求加载Controller多次
原因之一:HTML页面中 css样式 background:url() 或 img.iframe标签 src设置为空 例:<div style="background:url()&qu ...
- TCP首部介绍
每个T C P段都包含源端和目的端的端口号,用于寻找发端和收端应用进程.这两个值加上I P首部中的源端I P地址和目的端I P地址唯一确定一个T C P连接.有时,一个I P地址和一个端口号也称为一个 ...