核心思想：通过Html的iframe标签属性操作顶级窗口，再用php动态无刷新上传图片文件。

示例如下：

demo

　　|------uploads #存放上传的文件

　　|------index.php

　　|------upload.php

　　|------jquery.js

index.php

<!DOCTYPE html>

<html lang="en">

<head>

	<meta charset="UTF-8">

	<title>index</title>

	<script src="jquery.js"></script>

</head>

<body>

	<h1>

	<?php

		echo "当前时间戳：".time();

	?>

	</h1>

	<form action="upload.php"  target='myform' method="post" enctype="multipart/form-data">

		<p>文件上传：</p>

		<p>

		<input type="file" name="img">

		</p>

	</form>

	<div>

	<img src="" alt="" id="imgid">

	</div>

	<iframe name ="myform" frameborder="1" src="" style="display:none"></iframe>

</body>

<script>

$(':file').change(function(){

	$('form').submit();

});

</script>

</html>

upload.php

<?php

	error_reporting(0);

	$src=$_FILES['img']['tmp_name'];

	$file=$_FILES['img']['name'];

	$ext=array_pop(explode('.', $file));

	$rand=time().mt_rand().'.'.$ext;

	//echo $rand;

	$rst="uploads/{$rand}";

	if ($_FILES['img']['error']===0) {

		if(move_uploaded_file($src, $rst)){

			echo "<script>top.document.getElementById('imgid').src='{$rst}'</script>";

		}

	}

 ?>

php无刷新上传图片和文件的更多相关文章

  1. nodejs利用ajax实现网页无刷新上传图片

    nodejs利用ajax实现网页无刷新上传图片 标签(空格分隔): nodejs 通常情况下上传图片是要通过提交form表单来实现的,但是这又不可避免的产生了网页转. 利用ajax技术和FormDat ...

  2. 使用SWFUpload无刷新上传图片

    使用SWFUpload组件无刷新上传图片 在做项目时,需要用到一个图片的无刷新上传,之前听说过SWFUpload,于是想要通过SWFUpload来进行图片的无刷新上传,由于我的项目属于是ASP.NET ...

  3. Thinkphp框架 -- ajax无刷新上传图片

    用Thinkphp框架做无刷新上传图片 视图层 View <!doctype html> <html lang="en"> <head> < ...

  4. ajaxFileUpload.js 无刷新上传图片，支持多个参数同时上传，支持 ie6-ie10

    /* 131108-xxj-ajaxFileUpload.js 无刷新上传图片 jquery 插件,支持 ie6-ie10 依赖:jquery-1.6.1.min.js 主方法:ajaxFileUpl ...

  5. TP3.2：实现Ajax无刷新上传图片

    1.基于TP3.2+ajaxfileupload进行无刷新上传图片,本次只上传一张,多张以后搞出来再发 2.效果:   3.html代码: <html> <head> < ...

  6. jQuery+php+ajax实现无刷新上传文件功能

    jQuery+php+ajax实现无刷新上传文件功能,还带有上传进度条动画效果,支持图片.视频等大文件上传. js代码 <script type='text/javascript' src='j ...

  7. 无刷新上传图片，ajax 和 iframe

    iframe 上传 upload.html 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 ...

  8. Ajax 无刷新上传文件插件 uploadify 的使用

    在表单中无法直接使用 Ajax 上传文件,解决的思路可以是使用插件无刷新地上传文件,返回文件上传后的地址,然后把该地址作为 Ajax 的参数传递给服务器端进行数据库处理.可以使用 uploadify ...

  9. ajax无刷新上传图片

    页面: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> & ...

随机推荐

  1. IntelliJ IDEA 教程设置讲解

    IntelliJ IDEA 常用设置讲解 说明 IntelliJ在业界被公认为最好的java开发工具之一,尤其在智能代码助手.代码自动提示.重构.J2EE支持.Ant.JUnit.CVS整合.代码审查 ...

  2. MySQL(三)

    MYSQL(三) 上一章给大家说的是数据库的视图,存储过程等等操作,这章主要讲索引,以及索引注意事项,如果想看前面的文章,url如下: MYSQL入门全套(第一部) MYSQL入门全套(第二部) 索引 ...

  3. W3School-CSS 分类 (Classification) 实例

    CSS 分类 (Classification) 实例 CSS 实例 CSS 背景实例 CSS 文本实例 CSS 字体(font)实例 CSS 边框(border)实例 CSS 外边距 (margin) ...

  4. This text field does not specify an inputType or a hint

    android开发过程中突然发现的warning,EditText 报出 “This text field does not specify an inputType or a hint”   原因: ...

  5. 每天一个linux命令(1)：ls命令

    1. 命令格式: ls [选项] [目录名] 2. 命令功能: 列出目标目录中所有的子目录和文件. 4. 常用范例: 例一:列出/home/peidachang文件夹下的所有文件和目录的详细资料 命令 ...

  6. 解决Docker容器时区及时间不同步问题

    今天在系统集成测试时由测试人员提交了一个测试bug,原因是提交业务数据时间与实际时间(北京时间)有偏差,导致统计异常.由于我们集成测试是向测试人员直接提供完整的Docker镜像作为测试环境,原因应该是 ...

  7. kmeans算法实践

    这几天学习了无监督学习聚类算法Kmeans,这是聚类中非常简单的一个算法,它的算法思想与监督学习算法KNN(K近邻算法)的理论基础一样都是利用了节点之间的距离度量,不同之处在于KNN是利用了有标签的数 ...

  8. 在 Azure HDInsight 中安装和使用 Spark

    Spark本身用Scala语言编写,运行于Java虚拟机(JVM).只要在安装了Java 6以上版本的便携式计算机或者集群上都可以运行spark.如果您想使用Python API需要安装Python解 ...

  9. 第10章 Java类的三大特性之一：多态

    1.Java中的多态 多态是指对象的多种形态,主要包括这两种: 1.1引用多态 a.父类的引用可以指向本类的对象b.父类的引用可以指向子类的对象举个例子:父类Anmail,子类Dog,可以使用父类An ...

  10. 错题分析--ASP.NET

    解析:支架模板支持的类型包括Empty.Create.Delete.Details.Edit.List 解析:Spring支持4种依赖检查:默认的是none.因此说法不正确的结果是D 解析:各层之间不 ...