easyui的window插件再次封装

说明:该插件弹出的弹出框在最顶层的页面中,而不是在当前页面所在的iframe中,它的可拖动范围是整个浏览器窗口;所以不能用JS的parent对象获取弹出它的父页面,这里用了一个笨方法,最多支持四级弹出框,即弹出框中再弹出弹出框的情况,笨方法也是方法,它很简单、很有效。

代码:

/**
* easyui的window插件再次封装
* 2014年11月10日
*/ SimpoWin = {
showWin: function showWindow(title, url, width, height) {
if (!top.SimpoWinId) top.SimpoWinId = 0;
var divId = "simpoWin" + top.SimpoWinId;
top.$("body").append('<div id="' + divId + '"></div>'); top.$('#' + divId).window({
modal: true,
title: title,
width: width,
height: height,
collapsible: false,
minimizable: false,
maximizable: false,
content: function () {
return '<iframe frameborder="0" src="' + url + '" style="width: ' + (width - 14).toString() + 'px; height: ' + (height - 39).toString() + 'px; margin: 0;">';
},
onClose: function () {
top.$('#' + divId).window('destroy');
top.SimpoWinId--;
}
}).window('open'); top.SimpoWinId++;
switch (top.SimpoWinId) {
case 1:
top.SimpoWinParent1 = window;
break;
case 2:
top.SimpoWinParent2 = window;
break;
case 3:
top.SimpoWinParent3 = window;
break;
default:
top.SimpoWinParent = window;
break;
}
}, closeWin: function () {
var divId = "simpoWin" + (top.SimpoWinId - 1).toString();
top.$('#' + divId).window('close');
}, GetWinParent: function () {
switch (top.SimpoWinId) {
case 1:
return top.SimpoWinParent1;
case 2:
return top.SimpoWinParent2;
case 3:
return top.SimpoWinParent3;
default:
return top.SimpoWinParent;
}
}
}

带回调函数版,支持传入url或div容器id:

/**
* easyui的window插件再次封装
* 2014年11月10日
*/ SimpoWin = {
showWin: function (title, url, width, height, okcallback, closecallback) {
if (!top.SimpoWinId) top.SimpoWinId = 0;
var divId = "simpoWin" + top.SimpoWinId;
top.$("body").append('<div id="' + divId + '"></div>'); top.$('#' + divId).window({
modal: true,
title: title,
width: width,
height: height,
collapsible: false,
minimizable: false,
maximizable: false,
content: function () {
return '<iframe frameborder="0" src="' + url + '" style="width: ' + (width - 14).toString() + 'px; height: ' + (height - 39).toString() + 'px; margin: 0;">';
},
onClose: function () {
top.$('#' + divId).window('destroy');
top.SimpoWinId--;
if (closecallback) closecallback();
}
}).window('open'); top.SimpoWinId++;
switch (top.SimpoWinId) {
case 1:
top.SimpoWinParent1 = window;
top.SimpoWinOKCallback1 = okcallback;
break;
case 2:
top.SimpoWinParent2 = window;
top.SimpoWinOKCallback2 = okcallback;
break;
case 3:
top.SimpoWinParent3 = window;
top.SimpoWinOKCallback3 = okcallback;
break;
default:
top.SimpoWinParent = window;
top.SimpoWinOKCallback = okcallback;
break;
}
}, closeWin: function () {
var divId = "simpoWin" + (top.SimpoWinId - 1).toString();
top.$('#' + divId).window('close');
}, OK: function (data) {
switch (top.SimpoWinId) {
case 1:
top.SimpoWinOKCallback1(data);
case 2:
top.SimpoWinOKCallback2(data);
case 3:
top.SimpoWinOKCallback3(data);
default:
top.SimpoWinOKCallback(data);
}
}, GetWinParent: function () {
switch (top.SimpoWinId) {
case 1:
return top.SimpoWinParent1;
case 2:
return top.SimpoWinParent2;
case 3:
return top.SimpoWinParent3;
default:
return top.SimpoWinParent;
}
}, showWin2: function (title, containerId, width, height, closecallback) {
top.$('#' + containerId).css("display", "");
var l = (top.$(top.window).width() - width) / 2;
var t = (top.$(top.window).height() - height) / 2 + top.$(top.document).scrollTop();
top.$('#' + containerId).window({
modal: true,
title: title,
width: width,
height: height,
left: l,
top: t,
collapsible: false,
minimizable: false,
maximizable: false,
onClose: function () {
if (closecallback) closecallback();
}
}).window('open');
}, closeWin2: function (containerId) {
top.$('#' + containerId).window('close');
}
}

如何使用:

1、引用该插件的JS文件

2、父页面代码:

SimpoWin.showWin("选择素材", "TextMessageList.aspx", 880, 580);

3、子页面代码:

var winParent = SimpoWin.GetWinParent();
winParent.setValue(val); //子页面操作父页面
SimpoWin.closeWin(); //关闭弹出框

easyui的window插件再次封装的更多相关文章

  1. javascript笔记——jqGrid再次封装

    xingrunzhao js插件再次封装 demo 'use strict'; /** * commerce grid框架 * 依赖jqgrid */ (function ($_self, jQuer ...

  2. JS弹出框插件zDialog再次封装

    zDialog插件网址:http://www.jq22.com/jquery-info2426 再次封装zDialog的代码: (function ($) { $.extend({ iDialog: ...

  3. ajax的再次封装!(改进版) —— new与不 new 有啥区别?

    生命不息重构不止! 上一篇写了一下我对ajax的再次封装的方法,收到了很多有价值的回复,比如有童鞋建议用$.extend,一开始还以为要做成插件呢,后来才知道,原来这个东东还可以实现合并.省着自己再去 ...

  4. quartz.net插件类库封装(含源码)

    1.前言 目录: 1.quartz.net任务调度:源码及使用文档 2.quartz.net插件类库封装 最近项目需要做一写任务作业调度的工作,最终选择了quartz.net这个插件,它提供了巨大的灵 ...

  5. ajax的再次封装!

    js的动态加载.缓存.更新以及复用 系列有点卡文,放心会继续的.先来点更基础的,为js的加载做点铺垫. jQuery的ajax本来就很方便了,为啥还要在进一步的封装呢?这个首先要看项目的具体需求了,如 ...

  6. easyUI的window包含一个iframe,在iframe中如何关闭window?

    easyUI的window包含一个iframe,在iframe中如何关闭window? parent.$('#win').window('close');

  7. easyui表单插件-包括日期时控件-列表

    ← jQuery EasyUI 表单插件 – Numberspinner 数值微调器 jQuery EasyUI 表单插件 - Timespinner 时间微调器  jQuery EasyUI 插件 ...

  8. Easyui 让Window弹出居中

    原文:Easyui 让Window弹出居中 easyui1.3.2版本,window的弹出不会居中了.而dialog是会居中的,我们必须为为window的open事件做扩展 代码如下:只要加入以下代码 ...

  9. EasyUI在window中使用kindeditor 4.1.10在IE9中不能回显、获得焦点编辑的问题

    描述 :kindeditor4.1.10版本是当前最新的版本,在浏览器兼容性和功能方面都是值得一赞的,在开发中能方便快捷的满足一些开发需求. 问题 :  问题总是有的.  在使用过程中,遇到EasyU ...

随机推荐

  1. ASP.NET MVC请求处理管道生命周期的19个关键环节(1-6)

    ASP.NET和ASP.NET MVC的HttpApplication请求处理管道有共同的部分和不同之处,本系列将体验ASP.NET MVC请求处理管道生命周期的19个关键环节. ①以IIS6.0为例 ...

  2. VS 2008 生成操作中各个选项的差别

    近日,在编译C#项目时经常发现有些时候明明代码没错,但就是编译不过,只有选择重新编译或者清理再编译才会不出错,本着求学的态度,搜罗了下VS2008IDE中生成操作的种类以及差别,整理如下:   内容( ...

  3. 数据库的Timeout

    数据库的Timeout 其实有很多种情况. 一个是执行的超时时间 executionTimeOut,一个是连接的超时时间connectionTimeOut, 还有呢? 等待的超时时间 ReadTime ...

  4. sybase学习

    安装 下载安装包, 解压到/opt/sybase,注意必须目录是这样的/opt/sybase/ASE-15_0/install/ ,因为RUN_DBSVR里面写死了/opt/sybase/ASE-15 ...

  5. Java面向对象思想解决猜拳问题

    第一个面向对象的程序: 一个控制台猜拳小游戏: 第一步选择角色: 第二部选择剪刀,石头,布,与电脑进行PK: 第三部选择继续或者选择结束; 结束显示比赛的局数,以及各自赢得的分数: 设计思路 分析问题 ...

  6. Composer使用

    是什么 如果你知道yum.apt-get.npm.bower等命令中的一种或者多种,那么,你也能很快知道composer是什么了.没错,它就是PHP里快速安装类库的.平时,我们安装一个PHP类库,需要 ...

  7. ASP.net的指令

    3.2 ASP.NET指令 在基于面向对象思想的.NET平台,可以称之为“万物皆对象”了.在这里,一个页面,一个用户控件,一个母版页等,全都是对象,全都有各自的属性. 在类文件里,我们表示类的属性可以 ...

  8. Atitit sql执行计划

    Atitit sql执行计划 1.1. 首先要搞明白什么叫执行计划? 执行计划是数据库根据SQL语句和相关表的统计信息作出的一个查询方案,这个方案是由查询优化器自动分析产生的 Oracle中的执行计划 ...

  9. Servlet过滤器,Servlet过滤器创建和配置

    第一:Servlet的过滤器的创建和配置,创建一个过滤器对象需要实现javax.servlet.Filter接口,同时实现Filter的3个方法.        第一方法是过滤器中的init()方法用 ...

  10. 开始使用MarkDown写博客

    MarkDown 标题 #h1 ##h2 ###h3 h1 h2 h3 代码段 代码段缩进4个空格即可,如下: <div class="form-group"> < ...