子窗口通用接口,基于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 版权所有...
原文:http://my.oschina.net/lvcreator/blog/355068