核心思想:通过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. 删除docker的运行目录出错

    1.      错误类型

  2. WPF 自定义柱状图 BarChart

    WPF 自定义柱状图 当前的Telerik控件.DevExpress控件在图表控件方面做得不错,但是有时项目中需要特定的样式,不是只通过修改图表的模板和样式就能实现的. 或者说,通过修改当前的第三方控 ...

  3. JavaScript 动态插入 CSS

    写组件时有时想把一些组件特性相关的 CSS 样式封装在 JS 里,这样更内聚,改起来方便.JS 动态插入 CSS 两个步骤就可以 创建一个 style 对象 使用 stylesheet 的 inser ...

  4. git 常规使用小结

    总结下 git 的常规使用: 一般我们使用 git 来维护项目代码. 前提背景: 远程服务器上代码库,包含分支: 1.master - 版本发布分支 2.dev - 平时开发用的分支 一般操作流程: ...

  5. Cmake的交叉编译

    http://www.cmake.org/Wiki/CMake_Cross_Compiling

  6. The Engine Document of JustWeEngine

    JustWeEngine - Android FrameWork An easy open source Android Native Game FrameWork. Github Game core ...

  7. AR For Unity3D之HiAR分析

     前言 关于AR和Unity的基础知识,请自行前往各自的文档中心进行科普. 本文以国产的HiAR SDK为例,日后将尝试高通的vuforia SDK  我的环境 基于Hi AR1.2.0 ( hiar ...

  8. TCP/IP协议中网关和子网掩码概念

    网关: 不同网段的IP是不能直接互通的,需要一个设备来转发,这个设备就是网关,一般就是路由器,那么路由器的地址就是网关地址. 比如192.168.2.31要往192.168.3.31发送一条消息,他们 ...

  9. 微信菜单php 数组格式

    //备用 $menu['button']['0']['name'] = '积分'; $menu['button']['0']['sub_button']['0']['type'] = 'view'; ...

  10. golang使用yaml格式解析构建配置文件

    现在主流的配置文件格式有这么几种,xml.yaml.config…  xml就算了,太挫了,太土, 太繁琐… config 就是mysql,apache my.cnf的那种格式,这个格式适合功能分层, ...