利用iframe框架完成文件上传

前端页面

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>iframe伪装上传文件</title>
<script type="text/javascript" src="./jquery-2.0.0.min.js"></script>
<script type="text/javascript"> function up(){
var fname='up'+Math.random();//产生随机name值
$('<iframe name="'+fname+'" width="0" height="0" frameBorder="0"></iframe>').appendTo($('body'));//创建iframe标签,
$('form:first').attr('target',fname);//将php返回信息引到这个框架中来,不发生页面跳转
$('#xinxi').html('正在上传');//上传过程中的显示
//return false;
} </script>
</head>
<body>
<h1>iframe模拟Ajax文件上传</h1>
<h2 id="xinxi"></h2>
<form action="01.php" method="post" onsubmit="return up();" enctype="multipart/form-data">
<p><input type="file" name="pic" /></p>
<p><input type="submit" value="上传"/></p>
</form>
</body>
</html>

01.php

<?php
if(empty($_FILES)){
echo 'no file';
}
sleep(2);
$error=$_FILES['pic']['error']==0?'succ':'fail';
echo "<script>parent.document.getElementById('xinxi').innerHTML='$error'</script>"; ?>

页面效果

iframe仿Ajax上传文件的更多相关文章

  1. 用iFrame模拟Ajax上传文件

    前段时间在解决ajax上传文件时折腾了好一阵.直接用$.post上传文本信息肯定是没有问题的.但是$.post直接上传图片是不可行的. 后来看到网上的一些解决方案,有现成的ajax上传文件的封装的方法 ...

  2. 伪ajax上传文件

    伪ajax上传文件   最近在折腾伪ajax异步上传文件. 网上搜索了一下,发现大部分方法的input file控件都局限于form中,如果是在form外的呢? 必须动态生成一个临时form和临时if ...

  3. 前端 - jquery方式 / iframe +form 方式 上传文件

    环境与上一章一样 jquery 方式上传文件: HTML代码 {#html代码开始#} <input type="file" id="img" > ...

  4. 闲话ajax,例ajax轮询,ajax上传文件[开发篇]

    引语:ajax这门技术早已见怪不怪了,我本人也只是就自己真实的经验去总结一些不足道的话.供不是特别了解的朋友参考参考! 本来早就想写一篇关于ajax的文章的,但是前段时间一直很忙,就搁置了,趁着元旦放 ...

  5. atitit.ajax上传文件的实现原理 与设计

    atitit.ajax上传文件的实现原理 与设计 1. 上传文件的三大难题 1 1.1. 本地预览 1 1.2. 无刷新 1 1.3. 进度显示 1 2.  传统的html4  + ajax 是无法直 ...

  6. Django框架 之 Form表单和Ajax上传文件

    Django框架 之 Form表单和Ajax上传文件 浏览目录 Form表单上传文件 Ajax上传文件 伪造Ajax上传文件 Form表单上传文件 html 1 2 3 4 5 6 7 <h3& ...

  7. django上课笔记7-jQuery Ajax 和 原生Ajax-伪造的Ajax-三种Ajax上传文件方法-JSONP和CORS跨域资源共享

    一.jQuery Ajax 和 原生Ajax from django.conf.urls import url from django.contrib import admin from app01 ...

  8. IE8/9 JQuery.Ajax 上传文件无效

    IE8/9 JQuery.Ajax 上传文件有两个限制: 使用 JQuery.Ajax 无法上传文件(因为无法使用 FormData,FormData 是 HTML5 的一个特性,IE8/9 不支持) ...

  9. springMVC+jsp+ajax上传文件

    工作中遇到的小问题,做个笔记 实现springMVC + jsp + ajax 上传文件 HTML <body> <form id="myform" method ...

随机推荐

  1. python中列表,元组,字符串如何互相转换

    python中有三个内建函数:列表,元组和字符串,他们之间的互相转换使用三个函数,str(),tuple()和list(),具体示例如下所示: >>> s = "xxxxx ...

  2. Centos 卸载OpenJdk

    [root@localhost ~]# rpm -qa|grep jdkjava-1.6.0-openjdk-devel-1.6.0.0-1.50.1.11.5.el6_3.i686java-1.7. ...

  3. [c++]堆和栈的区别

    堆和栈的区别一.预备知识—程序的内存分配一个由c/C++编译的程序占用的内存分为以下几个部分1.栈区(stack)— 由编译器自动分配释放 ,存放函数的参数值,局部变量的值等.其操作方式类似于数据结构 ...

  4. window.parent != window 解决界面嵌套问题

    页面在被嵌套的时,效果:,,如果用户点击“刷新”,该问题即可解决. 如果想通过代码解决的话,这个问题属于客户端的问题,不是服务器端的问题. 如果直接写:window.location.href = “ ...

  5. ubuntu 如何在recovery模式修改root密码

    今天遇到一个问题, 前提1: ubuntu系统的root密码我一直没有设定  前提2: ubuntu初始创建的sudo用户不知道怎么移除sudo权限用户了. 下面就精彩了, 首先没有root密码,你不 ...

  6. ssh 设置免password登录

    如果: 实现->操作机A机 要以用户"user1"身份.免password登录B机和C机? B机和C机 建立用户 user1 而且能够ssh 登录. A机设置: 1.安装ss ...

  7. 【Winform】Winform 制作一键发布web

    前言 最近web网站有个需要,就是打包给客户,客户能够自己手动的进行傻瓜式的安装发布web.找了很多资料,其中涉及到 文件解压 IIS操作 数据库还原 等. 发现现在就主要是两种解决方案: ①:使用V ...

  8. Codeforces Round #332 (Div. 2) C. Day at the Beach 线段树

    C. Day at the Beach Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/599/p ...

  9. Codeforces Gym 100114 A. Hanoi tower 找规律

    A. Hanoi tower Time Limit: 1 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/gym/100114 Descript ...

  10. TreeView1MouseMove

    procedure TForm1.TreeView1MouseMove(Sender: TObject; Shift: TShiftState; X,   Y: Integer); var   nod ...