zoukankan
html css js c++ java
[收藏]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
=
"
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;
"
+
this
.width[
this
.id]
+
"
px;' >
"
;
str
+=
"
<div style='padding-bottom:2px;background-color:
"
+
this
.normal
+
"
;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;
"
+
(
this
.width[
this
.id]
-
2
*
14
-
5
)
+
"
;'>
"
+
this
.title
+
"
</div>
"
;
if
(type
==
2
)
str
+=
"
<span style='14px;font-family:webdings;cursor:hand;' onclick='Cmgbox.minibox(this)'>0</span><span style='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
>
body
{
}
{
font-size
:
12px
;
}
</
style
>
</
head
>
<
body
>
<
a
href
="javascript:window.subwin('tit后。当然也之页全部html标签之后你已经试过放在这里,但是发现根本不起作用,这就涉及到下一个要注意的问题了df可能是发现根本不起作用,这就涉及到下一个要注意的问题了。<br><br>2、Build函数的最后,你是通过insertAdjacentHTML()方法把生成的代码放在了网le','title')"
>
跑出一个框
</
a
>
<
a
href
="javascript:window.subwin('你已经l标签之后你已经试过所以应该把对无法获取,方,也就是xWinxx赋值这个工作放在窗口第一次初始化完成的地放在这里,但是发现根本不起作用,这就涉及到下一个要注意的问试过放在这里','标题')"
>
跑出一个框
</
a
>
<
a
href
="javascript:window.subwin('放在build语句之后。当然也可能是发现根本不起作用,这就涉及到下一个要注意的问题了。<br><br>2、Build函数的最后,你是通过insertAdjacentHTML()方法把生成的代码放在了网页全部html标签之后你已经试过放在这里,但是发现根本不起作用,这就涉及到下一个要注意的问题了了网页全部html标','子窗口',600)"
>
跑出一个框
</
a
>
<
a
href
="javascript:window.subwin('页全部htfsdfs导致无法获取,所以应该把对xx赋值这个工作放在窗口第一次初始化完成的地方,也就是xWin函数中,this.b代码放在了网页全部html标签之后你已经试过ml','要注意的问题了df')"
>
跑出一个框
</
a
>
<
a
href
="javascript:window.msgbox('sdfsdfsdfsdfs导致无法获取,所以应该把对xx赋值这个工作放在窗口第一次初始化完成的地方,也就是xWin函数中,this.build语句之后把生成的代页全部html标签之后你已经试过放在这里,但是发现根本不起作用,这就涉及到下一个要注意的问题了df',function(){alert(true)},'码放在了网',1)"
>
警告框
</
a
>
</
body
>
</
html
>
QQ:273352165 evlon#126.com 转载请注明出处。
查看全文
相关阅读:
gRPC实战
深入浅出docker
jquery操作复选框(checkbox)的12个小技巧总结
System.Diagnostics.Process.Start的妙用
Redis持久化数据丢失及解决
【ASP.NET 问题】IIS发布网站后出现 "处理程序“PageHandlerFactoryIntegrated”在其模块列表中有一个错误"的解决办法
asp.net 网页抓取内容
Ajax学习资源大全[本来是转载的,但是现在我增加了很多]
jquery如何判断checkbox(复选框)是否被选中
JS获取屏幕高度
原文地址:https://www.cnblogs.com/evlon/p/702834.html
最新文章
SpringBoot框架(1)入门篇
centOS7虚拟机设置固定IP
设计模式Design Pattern(3) 责任链模式
SpringBoot框架(4) 类装配及Bean装配监听器
设计模式Design Pattern(4) 访问者模式
REST架构
水题46
二叉搜索树浙大10年机试题
北邮2012机试题二叉排序树
python 基础 day3
热门文章
python 基础 day4
python 网络编程基础 day10
python 基础 day1
python 基础 day6
python socket编程 day9
python 基础 day8
python 基础 day2
python 基础 day5
python 基础 day7
HTML5 开发APP
Copyright © 2011-2022 走看看