showBo.js 8.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164
  1. var Showbo={author:'showbo',homepage:'http://www.lenomC100.com'};
  2. //是否为ie浏览器
  3. Showbo.IsIE=!!document.all;
  4. //ie浏览器版本
  5. Showbo.IEVersion=(function(){if(!Showbo.IsIE)return -1;try{return parseFloat(/msie ([\d\.]+)/i.exec(navigator.userAgent)[1]);}catch(e){return -1;}})();
  6. //按id获取对象
  7. Showbo.$=function(Id,isFrame){var o;if("string"==typeof(Id))o= document.getElementById(Id);else if("object"==typeof(Id))o= Id;else return null;return isFrame?(Showbo.IsIE?frames[Id]:o.contentWindow):o;}
  8. //按标签名称获取对象
  9. //页面的高和宽******************************
  10. Showbo.isStrict=document.compatMode == "CSS1Compat";
  11. Showbo.BodyScale={x:0,y:0,tx:0,ty:0};//(x,y):当前的浏览器容器大小 (tx,ty):总的页面滚动宽度和高度
  12. Showbo.getClientHeight=function(){/*if(Showbo.IsIE)*/return Showbo.isStrict ? document.documentElement.clientHeight :document.body.clientHeight;/*else return self.innerHeight;*/}
  13. Showbo.getScrollHeight=function(){var h=!Showbo.isStrict?document.body.scrollHeight:document.documentElement.scrollHeight;return Math.max(h,this.getClientHeight());}
  14. Showbo.getHeight=function(full){return full?this.getScrollHeight():this.getClientHeight();}
  15. Showbo.getClientWidth=function(){/*if(Showbo.IsIE)*/return Showbo.isStrict?document.documentElement.clientWidth:document.body.clientWidth;/*else return self.innerWidth;*/}
  16. Showbo.getScrollWidth=function(){var w=!Showbo.isStrict?document.body.scrollWidth:document.documentElement.scrollWidth;return Math.max(w,this.getClientWidth());}
  17. Showbo.getWidth=function(full){return full?this.getScrollWidth():this.getClientWidth();}
  18. Showbo.initBodyScale=function(){Showbo.BodyScale.x=Showbo.getWidth(false);Showbo.BodyScale.y=Showbo.getHeight(false);Showbo.BodyScale.tx=Showbo.getWidth(true);Showbo.BodyScale.ty=Showbo.getHeight(true);}
  19. //页面的高和宽******************************
  20. Showbo.Msg={
  21. INFO:'info',
  22. ERROR:'error',
  23. WARNING:'warning',
  24. IsInit:false,
  25. timer:null,
  26. dvTitle:null,
  27. dvCT:null,
  28. dvBottom:null,
  29. dvBtns:null,
  30. lightBox:null,
  31. dvMsgBox:null,
  32. defaultWidth:300,
  33. moveProcessbar:function(){
  34. var o=Showbo.$('dvProcessbar'),w=o.style.width;
  35. if(w=='')w=20;
  36. else{
  37. w=parseInt(w)+20;
  38. if(w>100)w=0;
  39. }
  40. o.style.width=w+'%';
  41. },
  42. InitMsg:function(width){
  43. //ie下不按照添加事件的循序来执行,所以要注意在调用alert等方法时要检测是否已经初始化IsInit=true
  44. var ifStr='<iframe src="javascript:false" mce_src="javascript:false" style="position:absolute; visibility:inherit; top:0px;left:0px;width:100%; height:100%; z-index:-1;'
  45. +'filter=\'progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)\';"></iframe>',
  46. html='<div class="top"><div class="right"><div class="title" id="dvMsgTitle"></div></div></div>'+
  47. '<div class="body"><div class="right"><div class="ct" id="dvMsgCT"></div></div></div>'+
  48. '<div class="bottom" id="dvMsgBottom"><div class="right"><div class="btn" id="dvMsgBtns"></div></div></div>';
  49. this.dvMsgBox=document.createElement("div");
  50. this.dvMsgBox.id="dvMsgBox";
  51. this.dvMsgBox.innerHTML+=html;
  52. document.body.appendChild(this.dvMsgBox);
  53. this.lightBox=document.createElement("div");
  54. this.lightBox.id="ShowBolightBox";
  55. document.body.appendChild(this.lightBox);
  56. if(Showbo.IsIE&&Showbo.IEVersion<7){//加iframe层修正ie6下无法遮盖住select的问题
  57. this.lightBox.innerHTML+=ifStr;
  58. this.dvMsgBox.innerHTML+=ifStr;
  59. }
  60. this.dvBottom=Showbo.$('dvMsgBottom');
  61. this.dvBtns=Showbo.$('dvMsgBtns');
  62. this.dvCT=Showbo.$('dvMsgCT');
  63. this.dvTitle=Showbo.$('dvMsgTitle');
  64. this.IsInit=true;
  65. },
  66. checkDOMLast:function(){//此方法非常关键,要不无法显示弹出窗口。两个对象dvMsgBox和lightBox必须处在body的最后两个节点内
  67. if(document.body.lastChild!=this.lightBox){
  68. document.body.appendChild(this.dvMsgBox);
  69. document.body.appendChild(this.lightBox);
  70. }
  71. },
  72. createBtn:function(p,v,fn){
  73. debugger
  74. var btn=document.createElement("input");
  75. btn.type="button";
  76. btn.className='btn';
  77. btn.value=v;
  78. btn.onmouseover=function(){this.className='btnfocus';}
  79. btn.onmouseout=function(){this.className='btn';}
  80. btn.onclick=function(){
  81. Showbo.Msg.hide();
  82. if(fn)fn(p);
  83. }
  84. return btn;
  85. },
  86. alert:function(msg){
  87. this.show({buttons:{yes:'确认'},msg:msg,title:'消息'});
  88. },
  89. confirm:function(title,msg,fn1,fn2){
  90. //fn为回调函数,参数和show方法的一致
  91. this.show({buttons:{yes:'确认',no:'取消'},msg:msg,title:title,fn1:fn1,fn2:fn2,width:'420px'});
  92. },
  93. prompt:function(labelWord,defaultValue,txtId,fn){
  94. if(!labelWord)labelWord='请输入:';
  95. if(!defaultValue)defaultValue="";
  96. if(!txtId)txtId="msg_txtInput";
  97. this.show({title:'输入提示',msg:labelWord+'<input type="text" id="'+txtId+'" style="width:200px" value="'+defaultValue+'"/>',buttons:{yes:'确认',no:'取消'},fn:fn});
  98. },
  99. wait:function(msg,title){
  100. if(!msg)msg='正在处理..';
  101. this.show({title:title,msg:msg,wait:true});
  102. },
  103. show:function(cfg){
  104. //cfg:{title:'',msg:'',wait:true,icon:'默认为信息',buttons:{yes:'',no:''},fn:function(btn){回调函数,btn为点击的按钮,可以为yes,no},width:显示层的宽}
  105. //如果是等待则wait后面的配置不需要了。。
  106. if(!cfg)throw("没有指定配置文件!");
  107. //添加窗体大小改变监听
  108. if(Showbo.IsIE)window.attachEvent("onresize",this.onResize);
  109. else window.addEventListener("resize",this.onResize,false);
  110. if(!this.IsInit)this.InitMsg();//初始化dom对象
  111. else this.checkDOMLast();//检查是否在最后
  112. //检查是否要指定宽,默认为300
  113. if(cfg.width)this.defaultWidth=cfg.width;
  114. this.dvMsgBox.style.width=this.defaultWidth+'px';
  115. //可以直接使用show方法停止为进度条的窗口
  116. if(this.timer){clearInterval(this.timer);this.timer=null;}
  117. this.dvTitle.innerHTML='';
  118. if(cfg.title)this.dvTitle.innerHTML=cfg.title;
  119. this.dvCT.innerHTML='';
  120. if(cfg.wait){
  121. if(cfg.msg)this.dvCT.innerHTML=cfg.msg;
  122. this.dvCT.innerHTML+='<div class="pro"><div class="bg" id="dvProcessbar"></div></div>';
  123. this.dvBtns.innerHTML='';
  124. this.dvBottom.style.height='10px';
  125. this.timer=setInterval(function(){Showbo.Msg.moveProcessbar();},1000);
  126. }
  127. else{
  128. //if(!cfg.icon)cfg.icon=Showbo.Msg.INFO;
  129. if(!cfg.buttons||(!cfg.buttons.yes&&!cfg.buttons.no)){
  130. cfg.buttons={yes:'确定'};
  131. }
  132. if(cfg.icon)this.dvCT.innerHTML='<div class="icon '+cfg.icon+'"></div>';
  133. if(cfg.msg)this.dvCT.innerHTML+=cfg.msg+'<div class="clear"></div>';
  134. this.dvBottom.style.height='45px';
  135. this.dvBtns.innerHTML='<div class="height"></div>';
  136. if(cfg.buttons.yes){
  137. this.dvBtns.appendChild(this.createBtn('yes',cfg.buttons.yes,cfg.fn1));
  138. if(cfg.buttons.no)this.dvBtns.appendChild(document.createTextNode(' '));
  139. }
  140. if(cfg.buttons.no)this.dvBtns.appendChild(this.createBtn('no',cfg.buttons.no,cfg.fn2));
  141. }
  142. Showbo.initBodyScale();
  143. this.dvMsgBox.style.display='block';
  144. this.lightBox.style.display='block';
  145. this.onResize(false);
  146. },
  147. hide:function(){
  148. this.dvMsgBox.style.display='none';
  149. this.lightBox.style.display='none';
  150. if(this.timer){clearInterval(this.timer);this.timer=null;}
  151. if(Showbo.IsIE)window.detachEvent('onresize',this.onResize);
  152. else window.removeEventListener('resize',this.onResize,false);
  153. },
  154. onResize:function(isResize){
  155. if(isResize)Showbo.initBodyScale();
  156. Showbo.Msg.lightBox.style.width=Showbo.BodyScale.tx+'px';
  157. Showbo.Msg.lightBox.style.height=Showbo.BodyScale.ty+'px';
  158. Showbo.Msg.dvMsgBox.style.top=240+'px';
  159. Showbo.Msg.dvMsgBox.style.left=Math.floor((Showbo.BodyScale.x-Showbo.Msg.dvMsgBox.offsetWidth)/2)+'px';
  160. }
  161. }