推荐.NET教程:
ASP.NET
C#
开发环境
Ajax教程
控件开发
统计报表
数据库
Web服务
安装部署
CommunityServer
NHibernate
DataGrid/GridView
实用代码
VS2005
示例源码
MVC/三层
SqlHelper
入门源码
开源
CMS
Ajax/Atlas
C#.net
毕业设计
源码
经典代码
商业
本站作品
持久层
随书源码
WebService
英文/汉化
Asp.net2.0
阿牛·乐园
每天进步一点点
博客园
::
首页
::
新随笔
::
联系
::
订阅
::
管理
::
80 随笔 :: 14 文章 :: 389 评论 :: 13 引用
[收藏]JS模拟窗口
<!
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
>
<
html
xmlns
="http://www.w3.org/1999/xhtml"
>
<
head
>
<
meta
http-equiv
="Content-Type"
content
="text/html; charset=gb2312"
/>
<
script
language
="javascript"
>
function
$()
{
var
arr
=
new
Array();
for
(
var
i
=
0
; i
<
arguments.length; i
++
)
{
var
aa
=
arguments[i];
if
(
typeof
(aa)
==
'string')
{
aa
=
document.getElementById(aa);
}
if
(arguments.length
==
1
)
{
return
aa;
}
arr.push(aa);
}
return
arr;
}
function
Cmsgbox()
{
this
.title
=
null
;
this
.message
=
null
;
this
.left
=
[];
this
.top
=
[];
this
.isminibox
=
[];
this
.width
=
[];
this
.id
=
0
;
this
.hover
=
'orange';
this
.normal
=
'slategray';
this
.dragenable
=
false
;
this
.x
=
0
;
this
.y
=
0
;
this
.curindex
=
100
;
this
.actindex
=
null
;
this
.modal
=
true
;
this
.bgdivobj
=
null
;
}
Cmsgbox.prototype.subwin
=
function
(msg,fcallback,tit,w,l,t,modal,type)
{
var
buttoncss
=
"
width:69px;height:20px;color:#333;cursor:hand;
"
;
if
(type
==
2
)
{
if
(modal
==
"
undefined
"
||
modal
==
null
)
modal
=
false
;
this
.isminibox[
this
.id]
=
false
;
}
this
.basemsg(tit,msg,w,l,t,modal);
var
str
=
"
<div id='
"
+
this
.id
+
"
csubwin' onmousedown='Cmgbox.totop(this)' style='z-index:
"
+
(
this
.curindex
++
)
+
"
;background-color:white;position:absolute;border:2px solid
"
+
this
.normal
+
"
;left:
"
+
this
.left[
this
.id]
+
"
px;top:
"
+
this
.top[
this
.id]
+
"
px;width:
"
+
this
.width[
this
.id]
+
"
px;' >
"
;
str
+=
"
<div style='padding-bottom:2px;background-color:
"
+
this
.normal
+
"
;width:100%;height:16px;color:white;'
"
;
str
+=
"
onmousedown='Cmgbox.begindrag(this)' onmousemove='Cmgbox.ondrag(this)' onmouseup='Cmgbox.enddrag(this)'
"
;
if
(type
==
2
)
str
+=
"
ondblclick='Cmgbox.minibox(this.childNodes(1))'
"
;
str
+=
"
><div style='float:left;height:16px;overflow:hidden;margin:0px;padding:4px 0px 0px 5px;width:
"
+
(
this
.width[
this
.id]
-
2
*
14
-
5
)
+
"
;'>
"
+
this
.title
+
"
</div>
"
;
if
(type
==
2
)
str
+=
"
<span style='width:14px;font-family:webdings;cursor:hand;' onclick='Cmgbox.minibox(this)'>0</span><span style='width:14px;font-family:webdings;cursor:hand;' onclick='Cmgbox.closediv(this)'>r</span>
"
;
str
+=
"
</div><div style='margin:10px 5px 10px 10px;word-break:break-all;'>
"
+
this
.message
+
"
</div>
"
;
if
(type
==
0
||
type
==
"
undefinded
"
||
type
==
null
||
type
==
""
||
type
==
1
)
{
typestr
=
"
<input type='button' style='
"
+
buttoncss
+
"
' id='boxyes' value='确 定' />
"
;
if
(type
==
1
)
typestr
+=
"
<input type='button' style='
"
+
buttoncss
+
"
' value='取 消' onclick='Cmgbox.closediv(this)' />
"
;
str
+=
"
<div style=text-align:right;margin:0px;padding:7px;padding-right:15px;background:#ccc;'>
"
+
typestr
+
"
</div></div>
"
;
}
if
(
this
.modal)
this
.showbgdiv(
this
.curindex
-
2
);
this
.id
++
;
document.body.insertAdjacentHTML(
"
beforeEnd
"
,str);
if
(type
!=
2
)
{
$(
"
boxyes
"
).focus();
$(
"
boxyes
"
).onclick
=
function
()
{
Cmgbox.closediv(
this
);
if
(fcallback)
fcallback();
}
}
}
Cmsgbox.prototype.showbgdiv
=
function
(zindex)
{
var
swidth,sheight;
swidth
=
document.body.offsetWidth
+
document.body.offsetLeft
*
2
;
if
(document.body.clientHeight
<
screen.height)
sheight
=
screen.height;
else
sheight
=
document.body.clientHeight
+
document.body.offsetTop
*
2
;
var
bgobj
=
document.createElement(
"
div
"
);
bgobj.setAttribute('id','bgdiv');
bgobj.style.position
=
"
absolute
"
;
bgobj.style.top
=
"
0px
"
;
bgobj.style.background
=
"
#ccc
"
;
bgobj.style.filter
=
"
progid:dximagetransform.microsoft.alpha(style=3,opacity=25,finishopacity=75)
"
;
bgobj.style.left
=
"
0px
"
;
bgobj.style.width
=
swidth;
bgobj.style.height
=
sheight;
bgobj.style.zIndex
=
zindex;
bgobj.oncontextmenu
=
function
()
{
return
false
;}
bgobj.ondragstart
=
function
()
{
return
false
;}
bgobj.onselectstart
=
function
()
{
return
false
;}
document.body.appendChild(bgobj);
this
.bgdivobj
=
bgobj;
}
//
//////////////////////关闭窗口////////////////////////
Cmsgbox.prototype.closediv
=
function
(obj)
{
if
(
this
.modal)
{
document.body.removeChild(
this
.bgdivobj);
this
.bgdivobj
=
null
;
this
.modal
=
false
;
}
obj.parentNode.parentNode.removeNode(
true
);
}
//
////////////////////使窗口出现在最顶端/////////////////////////
Cmsgbox.prototype.totop
=
function
(obj)
{
this
.actindex
=
this
.curindex
-
1
;
if
(obj.style.zIndex
<
this
.actindex)
obj.style.zIndex
=
this
.curindex
++
;
}
//
///////////////////开始拖动///////////////////////////////////////////
Cmsgbox.prototype.begindrag
=
function
(obj)
{
if
(event.button
==
1
)
{
this
.dragenable
=
true
;
obj.setCapture();
var
box
=
obj.parentNode;
this
.x
=
event.clientX;
this
.y
=
event.clientY;
box.style.borderColor
=
this
.hover;
obj.style.backgroundColor
=
this
.hover;
box.style.filter
=
"
progid:DXImageTransform.Microsoft.shadow(direction=135,color=#8E8E8E,strength=5)
"
;
}
}
//
/////////////////////////拖动中////////////////////////////////////////
Cmsgbox.prototype.ondrag
=
function
(obj)
{
if
(
this
.dragenable)
{
var
box
=
obj.parentNode;
var
i
=
parseInt(box.id);
var
boxleft
=
event.clientX
-
this
.x
+
this
.left[i];
var
boxtop
=
event.clientY
-
this
.y
+
this
.top[i];
if
(boxleft
>
0
&&
boxleft
+
this
.width[i]
<
(document.body.offsetWidth
+
document.body.offsetLeft
*
2
))
box.style.pixelLeft
=
boxleft;
if
(boxtop
>
0
)
box.style.pixelTop
=
boxtop;
}
}
//
////////////////////////结束拖动/////////////////////////////////
Cmsgbox.prototype.enddrag
=
function
(obj)
{
if
(
this
.dragenable)
{
var
box
=
obj.parentNode;
var
i
=
parseInt(box.id);
this
.dragenable
=
false
;
box.style.borderColor
=
this
.normal;
obj.style.backgroundColor
=
this
.normal;
this
.left[i]
=
box.style.pixelLeft;
this
.top[i]
=
box.style.pixelTop;
box.style.filter
=
""
;
obj.releaseCapture();
}
}
//
///////////////////////窗口最小化///////////////////////////////
Cmsgbox.prototype.minibox
=
function
(obj)
{
var
title
=
obj.parentNode;
var
i
=
parseInt(title.parentNode.id);
if
(
this
.isminibox[i]
=!
this
.isminibox[i])
{
title.nextSibling.style.display
=
"
none
"
;
obj.innerHTML
=
"
2
"
;
}
else
{
title.nextSibling.style.display
=
""
;
obj.innerHTML
=
"
0
"
;
}
}
Cmsgbox.prototype.basemsg
=
function
(tit,msg,w,l,t,modal)
{
this
.title
=
tit
||
"
系统消息
"
;
this
.message
=
msg;
if
(modal
==
"
undefined
"
||
modal
==
null
)
modal
=
true
;
if
(w
==
"
undefined
"
||
w
==
null
||
w
==
""
)
w
=
300
;
if
(l
==
"
undefined
"
||
l
==
null
||
l
==
""
)
l
=
parseInt((document.body.clientWidth
-
w)
/
2
);
if
(t
==
"
undefined
"
||
t
==
null
||
t
==
""
)
t
=
100
+
document.body.scrollTop;
this
.left[
this
.id]
=
l;
this
.top[
this
.id]
=
t;
this
.width[
this
.id]
=
w;
this
.modal
=
modal;
}
//
///////////////////实例化/////////////////////////////////////
var
Cmgbox
=
new
Cmsgbox();
window.subwin
=
function
(msg,tit,w,l,t,modal)
{Cmgbox.subwin(msg,
function
()
{}
,tit,w,l,t,modal,
2
);}
//
跳出子窗口 例:window.subwin(标题,内容,宽,X坐标,Y坐标,是否模态显示); (默认为非模态)
window.msgbox
=
function
(msg,fcallback,tit,type,modal)
{
return
Cmgbox.subwin(msg,fcallback,tit,
""
,
""
,
""
,modal,type);}
//
跳出模态选框 例:window.msgbox(标题,内容,类型选择,是否模态显示);(type=0:alert; type=1:confirm)
</
script
>
<
title
>
无标题文档
</
title
>
<
style
>