核心思想:通过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. YARN资源调度器

    YARN资源调度器 转载请注明出处:http://www.cnblogs.com/BYRans/ 概述 集群资源是非常有限的,在多用户.多任务环境下,需要有一个协调者,来保证在有限资源或业务约束下有序 ...

  2. 烂泥:haproxy与nginx、zabbix集成

    本文由ilanniweb提供友情赞助,首发于烂泥行天下 想要获得更多的文章,可以关注我的微信ilanniweb. 昨天介绍了haproxy的手机匹配规则,今天再来介绍下haproxy与nginx.za ...

  3. sk_buff 里的len, data_len, skb_headlen

    http://blog.csdn.net/kakadiablo/article/details/7948414 struct sk_buff *skb; skb->len 是data长度,包含所 ...

  4. hammer.js的六大事件

    1.Pan事件:在指定的dom区域内,一个手指放下并移动事件,即触屏中的拖动事件.这个事件在触屏开发中比较常用: Panstart 拖动开始 Panmove 拖动过程 Panend 拖动结束 Panc ...

  5. 鼠标 mouseover和mouseout事件

    在div内想实现鼠标移入移出效果,最开始的时候是用了jquery的mouseout和mouseover事件来实现的, $('.product).mouseover(function(){ …… }). ...

  6. MMORPG大型游戏设计与开发(服务器 游戏场景 掉落与网络连接)

    时间一点点的消逝,伴着自己空闲日子将要结束的时候我尽量的学习和分享场景和AI的知识给朋友们,不过很遗憾的是这些文章还有不足的地方,就是有的难点没有完全的分析到.掉落在游戏中必不可少的,同时网络连接也是 ...

  7. NOIP2012 普及组 T3 摆花——S.B.S.

    题目描述 小明的花店新开张,为了吸引顾客,他想在花店的门口摆上一排花,共m盆.通过调查顾客的喜好,小明列出了顾客最喜欢的n种花,从1到n标号.为了在门口展出更多种花,规定第i种花不能超过ai盆,摆花时 ...

  8. AC日记——约瑟夫问题 codevs 1282

    1282 约瑟夫问题  时间限制: 1 s  空间限制: 128000 KB  题目等级 : 大师 Master 题解  查看运行结果     题目描述 Description 有编号从1到N的N个小 ...

  9. Jenkins学习三:介绍一些Jenkins的常用功能

    Jenkins其实就是一个工具,这个工具的作用就是调用各种其他的工具来达成你的目的. 1.备份.迁移.恢复jenkins 首先找到JENKINS_HOME,因为Jenkins的所有的数据都是以文件的形 ...

  10. PAT 1037. 在霍格沃茨找零钱(20)

    如果你是哈利·波特迷,你会知道魔法世界有它自己的货币系统 -- 就如海格告诉哈利的:"十七个银西可(Sickle)兑一个加隆(Galleon),二十九个纳特(Knut)兑一个西可,很容易.& ...