DIV/SPAN通用子窗口展现、关闭JS接口

子窗口通用接口,基于jQuery支持使用。目前设计时,使用的是1.7.2版。FF默认焦点未失去问题存在。

HTML & JS:

<html>
    <head>
        <title></title>
        <script charset="GB2312" type="text/javascript" src="js/jquery-1.7.2.js"></script>
        <script type="text/javascript">
        var flag = true;
        $(document).ready(function() {
            // 确认处理
            $("#butn").click(function() {
                if (flag) {
                    openArea("InfoWndw", "<input type=\"button\" id=\"clos\" value=\"关闭\" onclick=\"javascript:closArea(‘InfoWndw‘);\"/>MSGE CONT.", "1");
                    flag = false;
                } else {
                    openArea("InfoWndw", "<table border=‘1‘><tr><td>HTML TABL CONT</td></tr></table>", ‘1‘  );
                    flag = true;
                }
            });
        });
        // 子窗口打开
        function openArea(itemId, cont, type) {
            // 锁定背景区域显示
            $("#DVID_LOCK_VIEW").show(500);
            // 窗口展示内容设置
            if ("1" == type) {
                // 追加内容
                $("#" + itemId).append(cont);
            } else if ("2" == type) {
                // 设定内容
                $("#" + itemId).text(cont);
            } else {
                // 设定HTML
                $("#" + itemId).html(cont);
            }
            // 区域左上角上边距
            var areaTidx = 0;
            // 区域左上角左边距
            var areaLidx = 0;
            // 窗口高度
            var wndwHigh = $(window).height();
            // 窗口宽度
            var wndwWdth = $(window).width();
            // 区域高度
            var areaHigh = $("#" + itemId).height();
            // 区域宽度
            var areaWdth = $("#" + itemId).width();
            // 左上角起始位置计算(上边距)
            if (wndwHigh > areaHigh) {
                // 窗口高度大于区域高度时,计算上边距中间位置
                areaTidx = (wndwHigh - areaHigh) / 2;
            }
            // 左上角起始位置计算(左边距)
            if (wndwWdth > areaWdth) {
                // 窗口宽度大于区域宽度时,计算左边距中间位置
                areaLidx = (wndwWdth - areaWdth) / 2;
            }
//            // 各属性节点的属性值测试信息
//            alert("窗口:H-W : " + wndwHigh + ":" + wndwWdth + "\r\n区域:H-W : " + areaHigh + ":" + areaWdth + "\r\n位置:H-W : " + areaTidx + ":" + areaLidx);
            // 左上角定位设置
            $("#" + itemId).css("top", areaTidx).css("left", areaLidx);
            // 区域模块显示
            $("#" + itemId).show(1000);
            // 焦点移入
            $("#" + itemId).focus();
        }
        // 子窗口关闭
        function closArea(itemId) {
            // 区域模块显示
            $("#" + itemId).empty();
            // 区域模块显示
            $("#" + itemId).hide(500);
            // 锁定背景区域清理
            $("#DVID_LOCK_VIEW").hide(1000);
        }
        </script>
    </head>
    <body>
        <!--
        W:<input id="wdth"/>
        H:<input id="high"/>
        -->
        <input type="button" id="butn" value="显示"/>
        <div id="DVID_LOCK_VIEW" style="display:none;position:absolute;top:0px;left:0px;width:100%;height:100%;background-color:#336699;z-index:9998;-moz-opacity:0.6;opacity:.60;filter:alpha(opacity=60);"></div>
        <span id="InfoWndw" style="position:absolute;background:#6699CC;display:none;z-index:9999;"></span>
    </body>
</html>

LvCreator 版权所有...

时间: 2024-09-30 10:55:10

DIV/SPAN通用子窗口展现、关闭JS接口的相关文章

window.open 打开子窗口,关闭所有的子窗口

需求:通过window.open方法打开了子窗口,当关闭主窗口时,子窗口应当也关闭. 实现思路: 1.打开子窗口函数window.open(url,winName)的第二个参数winName可以唯一标识打开的窗口.因此关闭子窗口只需要使用winName.close()函数即可. 2.一个页面可能有多个子窗口.因此需要一个数组存储所有子窗口对象.关闭时,遍历数组即可. 3.子窗口还可以再打开子窗口.无限循环下去.因此需要判断. 此需求可以通过两个方法实现. 调用子窗口的关闭函数. 此方法易于理解,

DELPHI中MDI子窗口的关闭 和打开

Delphi中MDI子窗口的关闭方式默认为缩小而不是关闭,所以当你单击子窗口右上角的关闭按钮时会发觉该子窗口只是最小化,而不是你预期的那样被关闭.解决办法是在子窗口的OnClose事件处理过程中加入如下代码,示例: procedure ChildForm.OnClose(Sender: TObject; var Action: TCloseAction);begin   Action := caFree;end; Delphi为一个Form的关闭行为指定了四种方式,分别是: caNone 禁止F

js父窗口关闭时,子窗口随之关闭

最近,遇到一个权限管理的系统.由于权限管理的系统和本来的系统风格不一致,所有新打开一个窗口.问题就来了,admin注销之后,权限管理的窗口没有关闭.其他普通用户登录以后,仍然可以操作权限管理的窗口. 问题简化:admin注销的时候,或者main.html关闭的时候,打开的所有新窗口一起关闭.问题就解决了 直接看代码吧: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w

如何javaSwing关闭子窗口不关闭父窗口

如果子窗口设置为 setDefaultCloseOption(Jframe.Exit_ON_CLOSE)的话,关闭子窗口后,父窗口也跟着关闭. 想要只关闭子窗口,方法如下: 子窗口设置为setDefaultCloseOption(Jframe.DISPOSE_ON_CLOSE)

layer.js子窗口关闭并传数据到父窗的方法

昨晚整了很晚,一直找不到方法.去官网api看了好久,又在网上搜了很久 始终找不到答案.今天自己终于找到了方法. 难点:因为 确认和取消按钮都是在父窗 调用js生成的按钮.只能从父窗回调的时候去去数据并关闭子窗口.并不是子窗口自己关闭并把数据传到父窗.而网上给出的很多答案都是子窗口自己关闭并传数据到父窗的方法. [贴出我自己的代码,大概实现了流程.具体自己根据情况修改] 我的代码功能是 子窗口要传递数组给父窗,具体复杂的数据格式(如json等)类似 1.子窗口代码 var urls; functi

【2016-11-6】【坚持学习】【Day21】【子窗口关闭时,同步关闭它的主窗口】

SubWindow 子窗口代码 public partial class SubWindow : Window { public delegate void UpdateDelegate(); public UpdateDelegate myHandle; public SubWindow() { InitializeComponent(); this.Closed += SubWindow_Closed; } private void SubWindow_Closed(object sende

JS实现关闭当前子窗口,刷新父窗口

一.JS实现关闭当前子窗口,刷新父窗口 JS代码如下: <script> function refreshParent() {  window.opener.location.href = window.opener.location.href;  window.close();   }              </script>

JS实现关闭当前子窗口,刷新父窗口及调用父窗口的方法

一.JS实现关闭当前子窗口,刷新父窗口 JS代码如下: <script> function refreshParent() { window.opener.location.href = window.opener.location.href; window.close(); } </script> html页面代码如下: <input type="button" id="btn1" class="btn" valu

js关闭子窗口,刷新父窗口

父页面js:function btnAdd_onclick() {window.open("xxx.jsp", "","height=600, width=650, top=100, left=200,z-look=yes,toolbar=yes, menubar=no, scrollbars=yes, resizable=yes ,alwaysRaised=yes,location=no, status=yes" );} function re