PHP+iframe图片上传实现即时刷新效果


Posted in PHP onNovember 18, 2016

这几天在做一个图片上传功能,原本想用ajax上传图片实现即时刷新,可是一直实现不了,唉。

后来用了iframe框架来实现了,不过这个用这框架却存在一个问题,当我吧图片上传以后我要把上传的路径返回到这框架中,那么怎么取出来,开始我把值直接输出到iframe中,但是我去取出路径的时候一直没反应,一直在网上查看资料,但是各种版本就是没有一个全面的讲解怎么使用iframe上传图片然后实现实时刷新的功能,只能自己研究了。大多数都是说怎么上传就可以了,这个我也会,都断在这还真让人难受,只能自己研究了

既然iframe中上传成功后输出值到页面中,无法取出来,试了N中方法,查了N多资料,还真是让人蛋疼。

后来在iframe中加个src,再在图片上传成功后输出值写成一条简单的javascript语句输出就OK了,嘿嘿。总结一下吧:

html代码:

<iframe id="upload_target" name="upload_target" src="upload.php" style="width:0;heigth:0;overflow:hidden;border:0;position: absolute; left:-500px;"></iframe> //iframe设置成隐藏的,src链接的页面为图片上传的后台文件页面,不过加不加影响都不大,只不过为了更精确而已
<img id="tag_img" src="" />
<form enctype="multipart/form-data" action="upload.php" method="post" target="upload_target">
   <input type="file" name="userfile" class="file" value="" />
   <input type="submit" name="uploadimg" value="上传" />
</form> //表单的那么值对应着空框架的那么值,提交后跳转到空框架中,这样就不对父窗口页面进行刷新了

提交到后台upload.php页面验证后。都会有一个自己设置的路径生成

那么我们更新图片成功后,就可以把这个路径拿出来,通过JS改变父窗口中图片框中图片路径,重新赋值一下,这样就相当于是刷新一下地址了,而不用每次更新成功后都得去数据库把保存的路径地址取出来更新了。

这里我只写要返回的js代码

echo "<script type='text/javascript'>window.parent.document.getElementByIdx_x('tag_img').setAttribute('src','$updurl');</script>"; //这就是在框架中输出一段js代码,然后操作父框架中图片地址刷新成我上传的图片地址,$updurl为上传图片的地址

这样就能轻松实现图片上传无刷新页面,且图片实现即使刷新了

以上这篇PHP+iframe图片上传实现即时刷新效果就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

PHP 相关文章推荐
新浪新闻小偷
Oct 09 PHP
PHPMyAdmin 快速配置方法
May 11 PHP
php将数据库导出成excel的方法
May 07 PHP
wamp下修改mysql访问密码的解决方法
May 07 PHP
基于php无限分类的深入理解
Jun 02 PHP
php无限分类且支持输出树状图的详细介绍
Jun 19 PHP
php实现执行某一操作时弹出确认、取消对话框
Dec 30 PHP
php通过淘宝API查询IP地址归属等信息
Dec 25 PHP
浅谈php中urlencode与rawurlencode的区别
Sep 05 PHP
基于thinkPHP3.2实现微信接入及查询token值的方法
Apr 18 PHP
PHP基于phpqrcode类生成二维码的方法详解
Mar 14 PHP
TP5框架实现一次选择多张图片并预览的方法示例
Apr 04 PHP
PHP批量获取网页中所有固定种子链接的方法
Nov 18 #PHP
PHP实现二维数组按某列进行排序的方法
Nov 18 #PHP
PHP二维数组去重实例分析
Nov 18 #PHP
浅谈php fopen下载远程文件的函数
Nov 18 #PHP
PHP实现的自定义数组排序函数与排序类示例
Nov 18 #PHP
php array_walk 对数组中的每个元素应用用户自定义函数详解
Nov 18 #PHP
PHP屏蔽关键字实现方法
Nov 17 #PHP
You might like
图象函数中的中文显示
2006/10/09 PHP
Laravel 5框架学习之数据库迁移(Migrations)
2015/04/08 PHP
PHP生成随机数的方法总结
2018/03/01 PHP
laravel5.6框架操作数据curd写法(查询构建器)实例分析
2020/01/26 PHP
jquery隐藏标签和显示标签的实例
2013/11/11 Javascript
判断字符串的长度(优化版)中文占两个字符
2014/10/30 Javascript
javascript浏览器窗口之间传递数据的方法
2015/01/20 Javascript
Jquery中offset()和position()的区别分析
2015/02/05 Javascript
深入理解JavaScript系列(35):设计模式之迭代器模式详解
2015/03/03 Javascript
Websocket协议详解及简单实例代码
2016/12/12 Javascript
详解微信小程序入门五: wxml文件引用、模版、生命周期
2017/01/20 Javascript
用Node编写RESTful API接口的示例代码
2018/07/04 Javascript
AngularJS 监听变量变化的实现方法
2018/10/09 Javascript
js实现每日签到功能
2018/11/29 Javascript
js+springMVC 提交数组数据到后台的实例
2019/09/21 Javascript
js实现简单音乐播放器
2020/06/30 Javascript
[01:43]深扒TI7聊天轮盘语音出处4
2017/05/11 DOTA
使用python统计文件行数示例分享
2014/02/21 Python
Django学习笔记之Class-Based-View
2017/02/15 Python
pip matplotlib报错equired packages can not be built解决
2018/01/06 Python
Python之reload流程实例代码解析
2018/01/29 Python
tensorflow实现对图片的读取的示例代码
2018/02/12 Python
python逐行读写txt文件的实例讲解
2018/04/03 Python
Python日期时间Time模块实例详解
2019/04/15 Python
浅析PyTorch中nn.Linear的使用
2019/08/18 Python
python批量解压zip文件的方法
2019/08/20 Python
Python的Lambda函数用法详解
2019/09/03 Python
django haystack实现全文检索的示例代码
2020/06/24 Python
使用CSS3来绘制一个月食图案
2015/07/18 HTML / CSS
莫斯科制造商的廉价皮大衣:Fursk
2020/06/09 全球购物
幼儿园教学管理制度
2014/02/04 职场文书
幼儿园中秋节活动方案
2014/02/06 职场文书
学校纪律作风整改措施思想汇报
2014/10/11 职场文书
求职信内容一般写什么?
2015/03/20 职场文书
高考百日冲刺决心书
2015/09/23 职场文书
python opencv人脸识别考勤系统的完整源码
2021/04/26 Python