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. 【源码笔记】Nop定时任务

    网站需要定时执行不同的任务,比如清理无效的数据.定时发送mail等,Nop的这个定时任务设计比较好,简单的说就是将所有任务相同的属性持久化,具体的执行通过继承接口来实现. 持久化对象:Schedule ...

  2. 贫下中农版jQuery

    之前写过一篇JavaScript命名空间的文章,写完后一对比对jQuery的简单使用很是惊羡,看了看人家源码,用的原理很类似啊,改进一下之前的版本,做个简易版的jQuery 之前的代码 (functi ...

  3. 虚拟化平台cloudstack(7)——新版本的调试

    调试环境 ubuntu 12.04 JDK1.7 apache-maven-3.10 eclipse 4.2 Juno mysql 5 源码下载及调试 上面的几个软件在上一篇中已经介绍了. 在新的版本 ...

  4. 实战使用Axure设计App,使用WebStorm开发(6) – 迈向后端

    系列文章 实战使用Axure设计App,使用WebStorm开发(1) – 用Axure描述需求  实战使用Axure设计App,使用WebStorm开发(2) – 创建 Ionic 项目   实战使 ...

  5. Linux-磁盘管理小结

    这篇博文主要总结了Linux磁盘的一些操作,主要是硬盘的加载,分区(MBR分区和GPT分区),分区的挂载,以及swap分区的加载设置. 基础命令 df查看磁盘分区使用状况 -l //仅显示本地磁盘(默 ...

  6. IOS Socket 03-建立连接与登录

    1. 搭建python服务器 这里我们用到python服务器Socket Server.如何运行Server?下面介绍 1)通过百度云下载文件 http://pan.baidu.com/s/1i5yb ...

  7. Linux应用总结(1):自动删除n天前日志

    linux是一个很能自动产生文件的系统,日志.邮件.备份等.虽然现在硬盘廉价,我们可以有很多硬盘空间供这些文件浪费,让系统定时清理一些不需要的文件很有一种爽快的事情.不用你去每天惦记着是否需要清理日志 ...

  8. Atitit   发帖机实现(3 )---usrQBN023 js提交ajax内容到后端规范与标准化

    Atitit   发帖机实现(3 )---usrQBN023 js提交ajax内容到后端规范与标准化 大段内容务必要替换转义换行符号1 提交务必使用utf编码,否则解码后的可能缺失,是web serv ...

  9. Atitit 电子商务订单号码算法(java c# php js 微信

    Atitit 电子商务订单号码算法(java c# php js  微信 1.1. Js版本的居然钱三爷里面没有..只好自己实现了. 1.2. 订单号标准化...长度16位 1.3. 订单号的结构 前 ...

  10. flow.ci Beta 上线,将开发工作流自动化

    说起未来,我们会想到自动.智能.机器人...,希望可以从眼前重复繁琐的事情中解放出来,让"机器人"自动智能地帮我们做更多的事情:希望开发可以更自动化.智能化.社会化,更少的资源浪费 ...