`

jquery uploadify+jquery ui Dialog在ie上报缺少对象问题解决方案

阅读更多

这两天发现一个很蛋疼的问题,就是uploadify+dialog在ie上弹出框的关闭按钮是失效的,在其他浏览器全部OK,折腾 了半天,网上也搜了许久,一直没解决。所以领导说要既然解决不了,就去掉dialog,就用一个showDialog来实现,但是我觉得不好看,所以到网上找啊找,终于找到一个能满足要求的玩意,跟大家分享下。

1.样式
/* box */
.box{position:absolute;width:400px;left:50%;height:auto;z-index:100;background-color:#fff;border:1px #fff solid;padding:1px;}
.box h2{height:25px;font-size:14px;background-color:#CCC;position:relative;padding-left:10px;line-height:25px;color:#000;}
.box h2 a{position:absolute;right:5px;font-size:12px;color:#fff;}
.box .mainlist{padding:10px;}
#TB_overlayBG{background-color:#666;position:absolute;z-index:99;left:0;top:0;display:none;width:100%;height:100%;opacity:0.5;filter: alpha(opacity=50);-moz-opacity: 0.5;}

2.弹出层
<div id="TB_overlayBG"></div>
<div id="uploadFileDialog" class="box" style="display:none">
    <h2>
         <span>文件上传<a href="#" class="close">关闭</a>
            </span>
        </h2>
           <div class="mainlist">
	<input id="uploadFile_upload" name="uploadFile_upload" type="file" multiple="true">
	<div class="form-ele-wrap h200 enable-scroll">
	<div id="uploadFile_queue"></div>
	</div>
	<div class="btn-panel btn-dialog">
		<a id="uploadFile_uploadBtn" class="buttonClass">开始上传</a>&nbsp;
	    <a id="uploadFile_uploadCancel" class="buttonClass">取消所有上传</a>
	</div>
	</div>
</div>

3.js代码
function openDialog() {
			$("#TB_overlayBG").css({
				display : "block",
				height : $(document).height()
			});
			$("#uploadFileDialog").css({
						left : ($("body").width() - $(".box").width()) / 2 - 20
								+ "px",
						top : ($(window).height() - $(".box").height()) / 2
								+ $(window).scrollTop() + "px",
						display : "block"
					});
		}
		function closeDialog() {
			$("#TB_overlayBG").css("display", "none");
			$("#uploadFileDialog").css("display", "none");
		}



分享到:
评论
1 楼 又被代表了 2014-07-30  
你这不全啊

相关推荐

    JQUERY之Dialog+Uploadify综合API详解

    jQuery Dialog 是 jQuery UI 库中的一个组件,它提供了一种方便的方式来创建模态或非模态对话框。Dialog 可用于显示警告、确认消息、输入框等,增强了用户交互体验。 1. **初始化 Dialog** 初始化 Dialog 可以通过...

    MVC4下对话框中使用Uploadify上传多个文件

    在本文中,我们将深入探讨如何在ASP.NET MVC4框架下,利用JQuery Dialog插件创建一个弹出对话框,并在其中集成Uploadify组件实现多文件上传功能。这将涉及前端JavaScript库、后端C#处理逻辑以及数据库交互,旨在提供...

    jQuery权威指南-源代码

    其次详细讲解了jQuery的各种选择器、jQuery操作DOM的方法、jQuery中的事件与应用、jQuery中的动画和特效、Ajax在jQuery中的应用,以及各种常用的jQuery插件的使用方法和技巧,所有这些知识点都配有完整的示例(包括...

    JQuery权威指南源代码

    使用jQuery UI插件以拖动方式管理相册 第9章 使用browser对象获取浏览器信息 使用boxModel对象检测是否是W3C盒子模型 使用$.each()工具函数遍历数组 使用$.each()工具函数遍历ajaxSettings对象 使用$.grep()...

    Struts2+uploadify多文件上传实例

    总的来说,这个实例展示了如何使用Struts2和Uploadify插件实现在web应用中上传多文件的功能,包括前端的UI设置、事件监听以及后台的文件处理逻辑。这对于任何需要用户上传文件的项目都是一个基础且实用的示例。

    ssh加ajax注解版

    Dialog弹框可能是基于jQuery UI或自定义的JavaScript组件,用于提示用户信息或者进行交互。 5. **Uploadify上传插件**:Uploadify是一个基于jQuery的文件上传插件,它支持多文件选择、进度条显示和错误处理等功能。...

    DWZ富客户端框架docx

    **DWZ富客户端框架** 是一个专为Web应用设计的高效、轻量级的JavaScript框架,旨在简化网页的开发...同时,由于其开源性质,开发者可以在遇到问题时参考源码或寻求社区的帮助,进一步提高了开发效率和解决问题的能力。

    dwz-user-guide.pdf

    - **社区交流**:加入相关技术社区,与其他开发者交流经验,解决问题。 #### 四、DWZ与其它JS框架的区别 - **最大优点**:DWZ相较于其他框架更专注于Web应用的快速开发,特别是在Ajax交互方面具有独特优势。 - **...

    DWZ中文开发手册

    DWZ富客户端框架,作为一款由国人自主研发的RIA(Rich Internet Application)框架,其核心构建在jQuery基础上,旨在提供一种简单实用、易于扩展且能快速进行Web应用开发的解决方案。其设计初衷聚焦于“简单实用、...

    DWZ富客户端框架,使用教程

    - **jQuery 1.4.2和jquery.validate.js在IE的兼容问题**:需要关注特定版本的jQuery和插件之间的兼容性问题,并采取相应的解决方案。 #### 五、版本控制与升级 - **版本命名规则**:DWZ遵循一定的版本命名规则,...

    DWZ使用帮助文档

    - **jQuery1.4.2和jquery.validate.js在IE的兼容问题**: 更新到最新版本以解决兼容性问题。 - **升级jQuery1.4.2注意事项**: 在升级前备份代码并测试新版本的兼容性。 - **weblogic访问xml问题**: 调整weblogic...

Global site tag (gtag.js) - Google Analytics