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读取RSS feed的代码
Aug 01 PHP
PHP表单验证的3个函数ISSET()、empty()、is_numeric()的使用方法
Aug 22 PHP
PHP防CC攻击实现代码
Dec 29 PHP
php从完整文件路径中分离文件目录和文件名的方法
Mar 13 PHP
php删除指定目录的方法
Apr 03 PHP
PHP的Yii框架中View视图的使用进阶
Mar 29 PHP
php mysql操作mysql_connect连接数据库实例详解
Dec 26 PHP
wordpress自定义标签云与随机获取标签的方法详解
Mar 22 PHP
PHP中number_format()函数的用法讲解
Apr 08 PHP
如何在PHP中使用AES加密算法加密数据
Jun 24 PHP
有关PHP 中 config.m4 的探索
Aug 26 PHP
PHP实现倒计时功能
Nov 16 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
PHP FATAL ERROR: CALL TO UNDEFINED FUNCTION BCMUL()解决办法
2014/05/04 PHP
PHP+Jquery与ajax相结合实现下拉淡出瀑布流效果【无需插件】
2016/05/06 PHP
PHP查询附近的人及其距离的实现方法
2016/05/11 PHP
PHP+mysql实现从数据库获取下拉树功能示例
2017/01/06 PHP
Vagrant(WSL)+PHPStorm+Xdebu 断点调试环境搭建
2019/12/13 PHP
使用新的消息弹出框blackbirdjs
2008/10/16 Javascript
仿校内登陆框,精美,给那些很厉害但是没有设计天才的程序员
2008/11/24 Javascript
jQuery中的bind绑定事件与文本框改变事件的临时解决方法
2010/08/13 Javascript
javascript制作loading动画效果 loading效果
2014/01/14 Javascript
Extjs表单常见验证小结
2014/03/07 Javascript
JS+JSP通过img标签调用实现静态页面访问次数统计的方法
2015/12/14 Javascript
JavaScript实现自定义媒体播放器方法介绍
2017/01/03 Javascript
JavaScript实现事件的中断传播和行为阻止方法示例
2017/01/20 Javascript
JavaScript+Html5实现按钮复制文字到剪切板功能(手机网页兼容)
2017/03/30 Javascript
Node.js 使用递归实现遍历文件夹中所有文件
2017/09/18 Javascript
React Native中TabBarIOS的简单使用方法示例
2017/10/13 Javascript
微信小程序 swiper 组件遇到的问题及解决方法
2019/05/26 Javascript
js实现浏览器打印功能的示例代码
2020/07/15 Javascript
微信小程序实现左滑删除效果
2020/11/18 Javascript
vue使用lodop打印控件实现浏览器兼容打印的方法
2021/02/07 Vue.js
[01:14:12]2018DOTA2亚洲邀请赛4.7 总决赛 LGD vs Mineski 第二场
2018/04/09 DOTA
Python实现在线程里运行scrapy的方法
2015/04/07 Python
Python数据结构与算法之图结构(Graph)实例分析
2017/09/05 Python
python的几种矩阵相乘的公式详解
2019/07/10 Python
Pytorch maxpool的ceil_mode用法
2020/02/18 Python
英国领先的豪华时尚家居网上商店:Amara
2019/08/12 全球购物
买房子个人收入证明
2014/01/16 职场文书
歌唱比赛主持词
2014/03/18 职场文书
博士生求职信
2014/07/06 职场文书
迎七一演讲稿
2014/09/12 职场文书
北大自主招生自荐信
2015/03/04 职场文书
幼儿园教学工作总结2015
2015/05/12 职场文书
毕业班工作总结
2015/08/10 职场文书
公司岗位说明书
2015/10/08 职场文书
校园安全教育心得体会
2016/01/15 职场文书
详细聊聊MySQL中慢SQL优化的方向
2021/08/30 MySQL