<!doctype html>
<html>
<head>
<meta charset=utf-8>
<head>
<title>ajax 文件上传~~</title>
</head>
<script>
window.onload=function(){
var form=document.getElementsByTagName('form')[0];
form.onsubmit=function(){
var iframe=document.createElement('iframe');
iframe.src='do_upload.php';
var iframe_name="iframe"+Math.random();
iframe.name=iframe_name;
document.body.appendChild(iframe);
iframe.style.width='0px';
iframe.style.height='0px';
iframe.frameBorder='0';
form.target=iframe_name;
}
}
</script>
<body>
<form enctype='multipart/form-data' method='post' action='do_upload.php'>
请选择文件:<input type='file' name='myFile'/><br/>
<input type='submit'/>
<div id='msg'></div>
</form>
</body>
</html>

PHP部分

<?php
$up_file=$_FILES['myFile'];
if($up_file['error']===0){
if(!file_exists('./imgs')){
mkdir('./imgs');
}
$save_name=rand().$up_file['name'];
$bool=move_uploaded_file($up_file['tmp_name'],"./imgs/$save_name");
if($bool){
$msg='上传成功!';
}else{
$msg='上传失败!';
}
}
echo
"<script>
var msg=parent.document.getElementById('msg');
msg.innerHTML='<font color=red>$msg</forn>';
</script>";
?>

iframe实现Ajax文件上传效果示例的更多相关文章

  1. iframe和ajax文件上传方法

    为什么使用这两种方法文件上传呢,主要是因为局部刷新问题 上传问题,主要是使用form表单,或者用请求一个文件上传 iframe 大多网站都是有一个整体的固定结构,然后进行局部刷新,我们可以使用AJAX ...

  2. iframe 模拟ajax文件上传and formdata ajax 文件上传

    对于文件上传 有好多种方式,一直想总结 文件上传的方法 今天就来写下 iframe  的文件上传的代码 本人语言表达能里有限,不多说了 直接上代码. 首先看 总体页面. 总共就三个文件. 实际上也就是 ...

  3. form+iframe实现ajax文件上传

    在做文件上传时除了传入文件外,还有附件参数,并且要求不刷新页面,之前是表单提交的方式,现在修改成ajax上传的方式,由于没有选择用插件,所以用form+iframe的方式,并且这种方式对IE8以上及主 ...

  4. AJAX-----11iframe模拟ajax文件上传效果原理3

    如果直接给用户提示上传成功,那么如果用户上传的文件比较大点,那么等上半天都没反映,那么用户很有可能会刷新或者关了从来等... 那么会给我们服务器带来一定的影响,所以我们可以对这方面的用户体验度进行提升 ...

  5. 用Fine Uploader+ASP.NET MVC实现ajax文件上传[代码示例]

    Fine Uploader(http://fineuploader.com/)是一个实现 ajax 上传文件的 Javascript 组件. This project attempts to achi ...

  6. [Fine Uploader] 用Fine Uploader+ASP.NET MVC实现ajax文件上传[代码示例]

    Fine Uploader(http://fineuploader.com/)是一个实现 ajax 上传文件的 Javascript 组件   This project attempts to ach ...

  7. AJAX-----10iframe模拟ajax文件上传效果原理2

    在实际开发中其实我们可以给用户一些提示,比如上传成功或者上传失败,废话不多说,走码: <!DOCTYPE html> <html lang="en"> &l ...

  8. AJAX-----09iframe模拟ajax文件上传效果原理1

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. [代码示例]用Fine Uploader+ASP.NET MVC实现ajax文件上传

    原文 [代码示例]用Fine Uploader+ASP.NET MVC实现ajax文件上传 Fine Uploader(http://fineuploader.com/)是一个实现 ajax 上传文件 ...

随机推荐

  1. Spatial Transformer Networks

    参考:http://blog.csdn.net/xbinworld/article/details/69049680 论文的关键在理解这句话: 先通过V中坐标(xtarget,ytarget)以此找到 ...

  2. 【linux】tcpdump抓包

    tcpdump -i eth0 host 192.168.11.22 -w ./target.cap 上面指令,抓取eth0中与192.168.11.22相关的流量,保存到target.cap中

  3. myEclipse开发内存溢出解决办法myEclipse调整jvm内存大小java.lang.OutOfMemoryError: PermGen space及其解决方法

    摘要: tomcat部署多个项目后,启动tomcat正常,访问项目时却会出现该错误在网上查了查又试了好几次,才解决,将解决方法记录下来,以方便以后查看或让遇到同样问题的朋友有个参考 PermGen s ...

  4. python 全栈开发,Day124(MongoDB初识,增删改查操作,数据类型,$关键字以及$修改器,"$"的奇妙用法,Array Object 的特殊操作,选取跳过排序,客户端操作)

    一.MongoDB初识 什么是MongoDB MongoDB 是一个基于分布式文件存储的数据库.由 C++ 语言编写.旨在为 WEB 应用提供可扩展的高性能数据存储解决方案. MongoDB 是一个介 ...

  5. 去掉li列表前面的空格

    如果用li做列表的话,li前面的空格其实是li的默认样式.因为li位于ul里面,所以,有空格代表了ul肯定有padding值. ul { margin: 0px; padding: 0px; }

  6. canvas绘制简易动画

    在canvas画布中制作动画相对来说很简单,实际上就是不断变化的坐标.擦除.重绘的过程 1.使用setInterval方法设置动画的间隔时间. setInterval(code,millisec) s ...

  7. SqlServer索引碎片

    1.产生碎片的操作 通过sys.dm_index_physical_stats来查看,索引上的页不在具有连续性时就会产生碎片,碎片是索引上页拆分的物理结果. (1).插入操作: INSERT操作在聚集 ...

  8. SSD(single shot multibox detector)算法及Caffe代码详解[转]

    转自:AI之路 这篇博客主要介绍SSD算法,该算法是最近一年比较优秀的object detection算法,主要特点在于采用了特征融合. 论文:SSD single shot multibox det ...

  9. Jmeter如何提取响应头部的JSESSIONID

    近期有柠檬班的学生找到华华,问了一个问题,就是利用Jmeter做接口测试的时候,如何提取头部的JSESSIONID然后传递到下一个请求,继续完成当前用户的请求. 其实,关于这个问题有三种种解决方法: ...

  10. 设计模式之Jdk动态代理

    什么是动态代理呢?就是在java的运行过程中,动态的生成的代理类.(为了更熟悉的了解动态代理,你必须先熟悉代理模式,可点击设计模式之代理模式 阅读)我们知道java属于解释型语言,是在运行过程中,寻找 ...