javascript
JS模拟窗口
摘自于網絡：http://www.cnblogs.com/joinger/articles/1297228.html
<!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' οnmοusedοwn='Cmgbox.totop(this)' style='z-index:"+(this.curindex++)+";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;width:100%;height:16px;color:white;' ";
??? str+="οnmοusedοwn='Cmgbox.begindrag(this)' οnmοusemοve='Cmgbox.ondrag(this)' οnmοuseup='Cmgbox.enddrag(this)' ";
??? if(type==2)
??????? str+="οndblclick='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;' οnclick='Cmgbox.minibox(this)'>0</span><span style='width:14px;font-family:webdings;cursor:hand;' οnclick='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='取 消' οnclick='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").οnclick=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.οncοntextmenu=function(){return false;}
??? bgobj.οndragstart=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.οndrag=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>
轉載于:https://www.cnblogs.com/qiushuixizhao/p/3792881.html
總結
- 上一篇： php将中文插入数据库出现乱码
- 下一篇： jQuery css()选择器使用说明