当前位置: 首页 > news >正文

swfupload 无法加载_解决SWFUpload的按钮图片加载慢的问题

使用SWFUpload时如果参数设置了button_image_url这一项,就会自动生成这个图片在button_placeholder_id的位置,但是实际运用中如果SWFUpload是实时加载的(比如弹出框,脚本动态加载的HTML等),就会明显的看出SWFUpload的按钮图片有一个延时。

首先我想当然地以为是SWFUpload在flash加载完时才把图片显示到浏览器上,导致了这个延时,于是我在SWFUpload的swfupload_loaded_handler里处理我的事件,发现依然有延时。

又做了几个测试,发现并不是SWFUpload加载的问题,而是object本身在浏览器里的渲染问题。比如我先把SWFUpload在页面上加载,加载完成后把他隐藏再显示,这样也会有同样的延时。

最后采用一个投机取巧的办法,就是给button的容器加上背景图、宽高让这个按钮占位元素变得和button一模一样,然后更改SWFUpload的加载模式(原来是替换掉按钮占位元素),改为插入到占位元素的子节点去,同时把opacity设为0,这样至始至终只有占位元素在显示,自然不会有延时的情况出现了。

修改swfupload.js中的代码:

//Private: loadFlash replaces the button_placeholder element with the flash movie.

SWFUpload.prototype.loadFlash = function() {vartargetElement, tempParent;//Make sure an element with the ID we are going to use doesn't already exist

if (document.getElementById(this.movieName) !== null) {throw "ID " + this.movieName + " is already in use. The Flash Object could not be added";

}//Get the element where we will be placing the flash movie

targetElement = document.getElementById(this.settings.button_placeholder_id) || this.settings.button_placeholder;if (targetElement ==undefined) {throw "Could not find the placeholder element: " + this.settings.button_placeholder_id;

}//Append the container and load the flash

tempParent = document.createElement("div");

tempParent.innerHTML= this.getFlashHTML(); //Using innerHTML is non-standard but the only sensible way to dynamically add Flash in IE (and maybe other browsers)

//targetElement.parentNode.replaceChild(tempParent.firstChild, targetElement);

/*解决button显示慢的问题*/$(tempParent.firstChild).css("opacity", 0);//偷懒使用jquery来处理opacity浏览器兼容

targetElement.removeAttribute("id");//必须移除这个id,否则多个swfupload同时存在时会有问题

targetElement.appendChild(tempParent.firstChild);/**/

//Fix IE Flash/Form bug

if (window[this.movieName] ==undefined) {

window[this.movieName] = this.getMovieElement();

}

};

View Code

相关文章:

  • 360全景拼接 opencv_360全景摄影制作复杂吗?360全景制作都需要那些技术?
  • 中艺人脸识别考勤机使用方法_有了移动oa还需要考勤机吗?
  • c++上传oss中文路径报错_OpenCC中文简体和繁体互转
  • 大油井号是多少_国际油价这么低,为什么不把油井都关了,直接买买买
  • dda算法画直线_计算机图形学三:直线光栅化的数值微分算法,中点Brensenham算法和三角形的光栅化...
  • arraylist存放不同数据类型_C++基础知识篇:C++的数据类型
  • oracle 两行数据合并成一行_oracle10g 多行数据合并为一行 | 学步园
  • idea创建包怎么让包分层_ROS基础-创建工作空间和功能包
  • python更改当前路径_类中python中的当前目录路径已更改
  • 德卡t10社保卡类型_德卡T10型多合一读写器通过社保检测
  • qgis折点打断_arcgis在折点处打断并建立网络分析(最短路径等问题)
  • icmp回复报文_UDP/IP硬件协议栈设计(六):ICMP
  • druid监控页面 关闭_springboot开启druid连接池的监控|教程
  • 开环传递函数判断系统类型_第七章-离散系统(1-20)
  • 5脚12v继电器接线图解_门禁系统现场接线图,简单易懂,喜欢学习的不要错过...
  • 《Javascript高级程序设计 (第三版)》第五章 引用类型
  • 【391天】每日项目总结系列128(2018.03.03)
  • 【笔记】你不知道的JS读书笔记——Promise
  • 30秒的PHP代码片段(1)数组 - Array
  • Android优雅地处理按钮重复点击
  • Django 博客开发教程 8 - 博客文章详情页
  • electron原来这么简单----打包你的react、VUE桌面应用程序
  • mysql 数据库四种事务隔离级别
  • PAT A1017 优先队列
  • PHP面试之三:MySQL数据库
  • python 学习笔记 - Queue Pipes,进程间通讯
  • redis学习笔记(三):列表、集合、有序集合
  • webgl (原生)基础入门指南【一】
  • ------- 计算机网络基础
  • 理解IaaS, PaaS, SaaS等云模型 (Cloud Models)
  • 前端代码风格自动化系列(二)之Commitlint
  • 算法系列——算法入门之递归分而治之思想的实现
  • 腾讯视频格式如何转换成mp4 将下载的qlv文件转换成mp4的方法
  • 鱼骨图 - 如何绘制?
  • 云栖大讲堂Java基础入门(三)- 阿里巴巴Java开发手册介绍
  • CMake 入门1/5:基于阿里云 ECS搭建体验环境
  • ​油烟净化器电源安全,保障健康餐饮生活
  • #ifdef 的技巧用法
  • #传输# #传输数据判断#
  • (39)STM32——FLASH闪存
  • (BFS)hdoj2377-Bus Pass
  • (非本人原创)我们工作到底是为了什么?​——HP大中华区总裁孙振耀退休感言(r4笔记第60天)...
  • (免费领源码)Java#Springboot#mysql农产品销售管理系统47627-计算机毕业设计项目选题推荐
  • (三)c52学习之旅-点亮LED灯
  • (五)大数据实战——使用模板虚拟机实现hadoop集群虚拟机克隆及网络相关配置
  • (学习日记)2024.02.29:UCOSIII第二节
  • (原創) 如何優化ThinkPad X61開機速度? (NB) (ThinkPad) (X61) (OS) (Windows)
  • .NET Core 实现 Redis 批量查询指定格式的Key
  • .net MVC中使用angularJs刷新页面数据列表
  • .NET运行机制
  • /etc/fstab和/etc/mtab的区别
  • [ Linux ] Linux信号概述 信号的产生
  • [2013][note]通过石墨烯调谐用于开关、传感的动态可重构Fano超——
  • [Android] 240204批量生成联系人,短信,通话记录的APK
  • [BT]BUUCTF刷题第8天(3.26)