<!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. Windows不能在本地计算机启动MongoDB，错误代码 100

    今天在计算机上面启动MongoDB时,直接给我报错,Windows不能在本地计算机启动MongoDB,服务错误代码 100. 这种问题解决方法是: 找到data文件夹db下面的mongod.lock文 ...

  2. LeetCode（6）：Z字形转换

    Medium! 题目描述: 将字符串 "PAYPALISHIRING" 以Z字形排列成给定的行数:(下面这样的形状) P A H N A P L S I I G Y I R 之后按 ...

  3. python 全栈开发，Day136(爬虫系列之第3章-Selenium模块)

    一.Selenium 简介 selenium最初是一个自动化测试工具,而爬虫中使用它主要是为了解决requests无法直接执行JavaScript代码的问题 selenium本质是通过驱动浏览器,完全 ...

  4. Linux学习笔记：使用ftp命令上传和下载文件

    Linux中如何使用ftp命令,包括如何连接ftp服务器,上传or下载文件以及创建文件夹.虽然现在有很多ftp桌面应用(例如:FlashFXP),但是在服务器.SSH.远程会话中掌握命令行ftp的使用 ...

  5. A 暴力搜索 剪枝是关键

    Description 盖伦是个小学一年级的学生,在一次数学课的时候,老师给他们出了一个难题:老师给了一个正整数 n,需要在不大于n的范围内选择三个正整数(可以是相同的),使它们三个的最小公倍数尽可能 ...

  6. Asp.Net Core2.0获取客户IP地址，及解决发布到Ubuntu服务器获取不到正确IP解决办法

    1.获取客户端IP地址实现方法(扩展类) using Microsoft.AspNetCore.Http; using Microsoft.AspNetCore.Mvc.ModelBinding; u ...

  7. MQ确认机制之事务机制----confirm串行

    一:介绍 1.说明原理 A:生产者将信道设置成confirm模式,一旦信道进到confirm模式,所有该信道上发布的消息都会被指派一个唯一的ID(从1开始). 一旦消息被投递到所有匹配的队列后,bro ...

  8. 047 大数据下的java client连接JDBC

    1.前提 启动hiveserver2服务 url,username,password. 2.官网 3.程序 4.结果 emp的第一列与第二列 5.源程序 package com.cj.it.hiveU ...

  9. (转)Java按指定行数读取文件

    package test import java.io.File; import java.io.FileReader; import java.io.IOException; import java ...

  10. Python爬虫之Beautiful Soup解析库的使用（五）

    Python爬虫之Beautiful Soup解析库的使用 Beautiful Soup-介绍 Python第三方库,用于从HTML或XML中提取数据官方:http://www.crummv.com/ ...