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 相关文章推荐
用PHP制作静态网站的模板框架(三)
Oct 09 PHP
一键删除顽固的空文件夹 软件下载
Jan 26 PHP
在任意字符集下正常显示网页的方法二(续)
Apr 01 PHP
PHP下几种删除目录的方法总结
Aug 19 PHP
PHP array 的加法操作代码
Jul 24 PHP
php自定义函数call_user_func和call_user_func_array详解
Jul 14 PHP
shell脚本作为保证PHP脚本不挂掉的守护进程实例分享
Jul 15 PHP
php 获取SWF动画截图示例代码
Feb 10 PHP
php使用fsockopen函数发送post,get请求获取网页内容的方法
Nov 15 PHP
php中的动态调用实例分析
Jan 07 PHP
PHP通过API获取手机号码归属地
May 28 PHP
WordPress的主题编写中获取头部模板和底部模板
Dec 28 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
在openSUSE42.1下编译安装PHP7 的方法
2015/12/24 PHP
PHP中SERIALIZE和JSON的序列化与反序列化操作区别分析
2016/10/11 PHP
JavaScript延迟加载
2021/03/09 Javascript
页面中iframe相互传值传参
2009/12/13 Javascript
javascript 哈希表(hashtable)的简单实现
2010/01/20 Javascript
jQuery学习7 操作JavaScript对象和集合的函数
2010/02/07 Javascript
JS+DIV实现鼠标划过切换层效果的实例代码
2013/11/26 Javascript
JavaScript实现数字数组按照倒序排列的方法
2015/04/06 Javascript
js实现文字截断功能
2016/09/14 Javascript
JavaScript排序算法动画演示效果的实现方法
2016/10/18 Javascript
JavaScript重定向URL参数的两种方法小结
2016/10/19 Javascript
JavaScript reduce和reduceRight详解
2016/10/24 Javascript
微信小程序--onShareAppMessage分享参数用处(页面分享)
2017/04/18 Javascript
Vue全家桶实践项目总结(推荐)
2017/11/04 Javascript
vue-cli实现多页面多路由的示例代码
2018/01/30 Javascript
Angular利用内容投射向组件输入ngForOf模板的方法
2018/03/05 Javascript
Node.js assert断言原理与用法分析
2019/01/04 Javascript
详解JavaScript 为什么要有 Symbol 类型?
2019/04/03 Javascript
python实现数据图表
2017/07/29 Python
Python正则捕获操作示例
2017/08/19 Python
使用Python设计一个代码统计工具
2018/04/04 Python
浅谈pandas中Dataframe的查询方法([], loc, iloc, at, iat, ix)
2018/04/10 Python
pow在python中的含义及用法
2019/07/11 Python
Python循环实现n的全排列功能
2019/09/16 Python
如何基于Python实现自动扫雷
2020/01/06 Python
你的自行车健身专家:FaFit24
2016/11/16 全球购物
西班牙三叶草药房:Farmacias Trébol
2019/05/03 全球购物
数字天堂软件测试面试题
2012/12/23 面试题
五年级科学教学反思
2014/02/05 职场文书
课程设计的心得体会
2014/09/03 职场文书
群众路线问题查摆对照检查材料
2014/10/04 职场文书
国庆放假通知怎么写
2015/07/30 职场文书
中秋节感想
2015/08/10 职场文书
MySQL一些常用高级SQL语句
2021/07/03 MySQL
【DOTA2】当街暴打?PSG LGD vs VG - DPC 2022 WINTER TOUR CN
2022/04/02 DOTA
MySQL中EXPLAIN语句及用法
2022/05/20 MySQL