打印

求仿confirm模拟对话框完美源码[已解决]

togoog [楼主]

天使共舞

高级会员

帖子: 422
体力: 873
威望: 0
当前: 北京海淀区

专长 网页设计,ASP,搜索

1^# 大中小发表于 2008-6-13 18:07

求高手帮忙抠出该例中的代码。我在网上找了好多但是个人觉得这个比较完美
http://www.51jsr.com/api/example/ui_MessageBox.html
还请各位高手帮忙看看。谢谢

[ 本帖最后由 togoog 于 2008-6-16 14:32 编辑 ]

附件: 您所在的用户组无法下载或查看附件，您需要注册/登录后才能查看！

www.daming2004.com警告伱~

TOP

做西部数码代理.Cn1元国际45元 | 将虚拟化进行到底

skybot

size

钻石会员

帖子: 2729
体力: 6424
威望: 6
当前: 上海长宁

专长 JS,C#,MSSQL

2^# 大中小发表于 2008-6-13 22:50

http://bbs.blueidea.com/thread-2808982-1-1.html

http://www.qlili.com 个人站帮点啊

TOP

【美橙超级G空间】688元绑定10个子目录 | oracle工程师注册

skybot

size

钻石会员

帖子: 2729
体力: 6424
威望: 6
当前: 上海长宁

专长 JS,C#,MSSQL

3^# 大中小发表于 2008-6-13 22:53

<!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" />
<title>MessageBox演示</title>
<script language="javascript">
/*******************************************************************************************   
 * http://2lin.net
 * Email:caoailin@gmail.com 
 * QQ:38062022 
 * Creation date: 2006-11-27 
 * 下面的内容可以拷贝到一个JS文件里面
*********************************************************************************************/
// 控制按钮常量
var MB_OK = 0;
var MB_CANCEL = 1;
var MB_OKCANCEL = 2;
var MB_YES = 3;
var MB_NO = 4;
var MB_YESNO = 5;
var MB_YESNOCANCEL = 6;
// 控制按钮文本
var MB_OK_TEXT = "确定";
var MB_CANCEL_TEXT = "取消";
var MB_YES_TEXT = " 是 ";
var MB_NO_TEXT = " 否 ";
//提示图标
var MB_ICON = "http://2lin.net/image/information.gif";
//委托方法
var MB_OK_METHOD = null;
var MB_CANCEL_METHOD = null;
var MB_YES_METHOD = null;
var MB_NO_METHOD = null;
var MB_BACKCALL = null;
var MB_STR = '<style type="text/css"></style>' +
			'<div id="msgBoxMask" class="msgbox_mask" style="filter: alpha(opacity=0);display:none;"></div>' +
			'<div class="msgbox" style="display:none; z-index:100000;" id="msgBox">' +
			'<div class="msgbox_title" id="msgBoxTitle"></div>' +
			'<div class="msgbox_icon" id="msgBoxIcon"></div>' +
			'<div class="msgbox_content" id="msgBoxContent"></div>' +
			'<div class="msgbox_control" id="msgBoxControl"></div></div>';
var Timer = null;
document.write(MB_STR);
var icon = new Image();
icon.src = MB_ICON;
/* 提示对话框
 * 参数 1 : 提示内容
 * 参数 2 : 提示标题
 * 参数 3 : 图标路径
 * 参数 4 : 按钮类型
*/
function MessageBox(){
   var _content = arguments[0] || "这是一个对话框！";
   var _title   = arguments[1] || "提示";
   var _icon    = arguments[2] || MB_ICON;
   var _button  = arguments[3] || MB_OK;
   MB_BACKCALL  = arguments[4];
   
   var _iconStr = '<img src="{0}">';
   var _btnStr  = '<input name="{0}" id="{0}" type="button" class="msgbox_button" value="{1}" onclick="MBMethod(this)" />';
   
   
   switch(_button)
   {      
	  case MB_CANCEL      : _btnStr = _btnStr.toFormatString("msgBoxBtnCancel", MB_CANCEL_TEXT); break;
	 
	  case MB_YES         : _btnStr = _btnStr.toFormatString("msgBoxBtnYes", MB_YES_TEXT); break;
	  
	  case MB_NO          : _btnStr = _btnStr.toFormatString("msgBoxBtnNo", MB_NO_TEXT); break;
	  
	  case MB_OKCANCEL    : 
	       _btnStr = _btnStr.toFormatString("msgBoxBtnOk", MB_OK_TEXT) + "&nbsp;&nbsp;" +
 		             _btnStr.toFormatString("msgBoxBtnCancel", MB_CANCEL_TEXT); 
		   break;
		   
	  case MB_YESNO       :
	        _btnStr = _btnStr.toFormatString("msgBoxBtnYes", MB_YES_TEXT) + "&nbsp;&nbsp;" +
		              _btnStr.toFormatString("msgBoxBtnNo", MB_NO_TEXT); 
		    break;
		 
	  case MB_YESNOCANCEL :
	        _btnStr = _btnStr.toFormatString("msgBoxBtnYes", MB_YES_TEXT) + "&nbsp;&nbsp;" +
		              _btnStr.toFormatString("msgBoxBtnNo", MB_NO_TEXT) + "&nbsp;&nbsp;" +
					  _btnStr.toFormatString("msgBoxBtnCancel", MB_CANCEL_TEXT); 
		    break;
	     
	  default :  _btnStr = _btnStr.toFormatString("msgBoxBtnOk", MB_OK_TEXT);  break;  
	  
   }
   //解决　FF 下会复位
   ScrollTop = GetBrowserDocument().scrollTop; 
   ScrollLeft = GetBrowserDocument().scrollLeft; 
   GetBrowserDocument().style.overflow = "hidden";
   GetBrowserDocument().scrollTop = ScrollTop;   
   GetBrowserDocument().scrollLeft = ScrollLeft; 
      
   $("msgBoxTitle").innerHTML = _title;
   $("msgBoxIcon").innerHTML = _iconStr.toFormatString(_icon);
   $("msgBoxContent").innerHTML = _content; 
   $("msgBoxControl").innerHTML =  _btnStr;
   
   OpacityValue = 0;
   $("msgBox").style.display = "";	   
   try{$("msgBoxMask").filters("alpha").opacity = 0;}catch(e){};
   $("msgBoxMask").style.opacity = 0;
   $("msgBoxMask").style.display = "";
   $("msgBoxMask").style.height = GetBrowserDocument().scrollHeight + "px";
   $("msgBoxMask").style.width = GetBrowserDocument().scrollWidth + "px";
   
   Timer = setInterval("DoAlpha()",1);
   //设置位置   
   $("msgBox").style.width = "100%";   
   $("msgBox").style.width = ($("msgBoxIcon").offsetWidth + $("msgBoxContent").offsetWidth + 2) + "px";
   
   $("msgBox").style.marginTop = (-$("msgBox").offsetHeight/2 + GetBrowserDocument().scrollTop) + "px";
   $("msgBox").style.marginLeft = (-$("msgBox").offsetWidth/2 + GetBrowserDocument().scrollLeft) + "px";   
   
   if(_button == MB_OK || _button == MB_OKCANCEL){
     $("msgBoxBtnOk").focus();
   }else if(_button == MB_YES || _button == MB_YESNO || _button == MB_YESNOCANCEL){
	   $("msgBoxBtnYes").focus();
   }  
}
var OpacityValue = 0;
var ScrollTop = 0;
var ScrollLeft = 0;
function GetBrowserDocument()
{
   var _dcw = document.documentElement.clientHeight;
   var _dow = document.documentElement.offsetHeight;
   var _bcw = document.body.clientHeight;
   var _bow = document.body.offsetHeight;
   
   if(_dcw == 0) return document.body;
   if(_dcw == _dow) return document.documentElement;
   
   if(_bcw == _bow && _dcw != 0) 
     return document.documentElement;
   else
     return document.body;
}
function SetOpacity(obj,opacity){
		if(opacity >=1 ) opacity = opacity / 100;	
			
		try{obj.style.opacity = opacity; }catch(e){}
		
		try{ 
			if(obj.filters){
				obj.filters("alpha").opacity = opacity * 100;
			}
			
		}catch(e){}
}
	
function DoAlpha(){
	if (OpacityValue > 20){clearInterval(Timer);return 0;}
	OpacityValue += 5;	
	SetOpacity($("msgBoxMask"),OpacityValue);
}
function MBMethod(obj)
{   
   switch(obj.id)
   {
      case "msgBoxBtnOk" : if(MB_BACKCALL) {MB_BACKCALL(MB_OK);} else {if(MB_OK_METHOD) MB_OK_METHOD();} break;
	  case "msgBoxBtnCancel" : if(MB_BACKCALL) {MB_BACKCALL(MB_CANCEL);} else {if(MB_CANCEL_METHOD) MB_CANCEL_METHOD();} break;
	  case "msgBoxBtnYes" : if(MB_BACKCALL) {MB_BACKCALL(MB_YES);} else {if(MB_YES_METHOD) MB_YES_METHOD();} break;
	  case "msgBoxBtnNo" : if(MB_BACKCALL) {MB_BACKCALL(MB_NO);} else {if(MB_NO_METHOD) MB_NO_METHOD();} break;
   }   
   
   MB_OK_METHOD = null;
   MB_CANCEL_METHOD = null;
   MB_YES_METHOD = null;
   MB_NO_METHOD = null;
   MB_BACKCALL = null;
   
   MB_OK_TEXT = "确定";
   MB_CANCEL_TEXT = "取消";
   MB_YES_TEXT = " 是 ";
   MB_NO_TEXT = " 否 ";
   
   $("msgBox").style.display = "none";  
   $("msgBoxMask").style.display = "none";     
   GetBrowserDocument().style.overflow = ""; 
   GetBrowserDocument().scrollTop = ScrollTop;
   GetBrowserDocument().scrollLeft = ScrollLeft; 
}
String.prototype.toFormatString = function(){  
   var _str = this;
   for(var i = 0; i < arguments.length; i++){    
      _str = eval("_str.replace(/\\{"+ i +"\\}/ig,'" + arguments[i] + "')");
   }
   return _str;
}
function $(obj){
   return document.getElementById(obj);
}
///////////////////////////////////////////////////////////////////////////////////////
</script>
<script language="javascript">
function test()
{
   var _msg = "<font color=red><b>演示：</b></font><br/>普通对话框！";
   MessageBox(_msg);
}
function test1()
{
  MB_OK_METHOD = function(){alert('你按了OK');}
  MB_YES_METHOD = function(){alert('你按了YES');}
  MB_NO_METHOD = function(){alert('你按了NO');}
  MB_CANCEL_METHOD = function(){alert('你按了CANCEL');} 
  
  var _msg = "<font color=red><b>演示：</b></font><br/>调用对话框。是、否、取消";
  MessageBox(_msg,"演示",null,MB_YESNOCANCEL);  
}
function test2()
{ 
  var _msg = "<font color=red><b>演示：</b></font><br/>调用对话框。是、否、取消";
  MessageBox(_msg,"演示",MB_ICON,MB_YESNOCANCEL,callback);
}
function test4()
{ 
  var _msg = "<font color=red><b>演示：</b></font><br/>调用对话框。确定、取消";
  MessageBox(_msg,"演示",MB_ICON,MB_OKCANCEL,callback);
}
function callback(value)
{
  switch(value)
  {
     case MB_OK : alert('你按了OK'); break;
     case MB_YES : alert('你按了YES'); break;
     case MB_NO : alert('你按了NO'); break;
     case MB_CANCEL : alert('你按了CANCEL'); break;
   }
}
function test3()
{ 
  MB_YES_TEXT = "演示一";
  MB_NO_TEXT = "演示二";
  MB_CANCEL_TEXT = "演示三";
  var _msg = "<font color=red><b>演示：</b></font><br/>这是自定义的对话框<br/> <font color=green>MB_YES_TEXT  MB_NO_TEXT MB_CANCEL_TEXT MB_OK_TEXT</font>";
  MessageBox(_msg,"演示",MB_ICON,MB_YESNOCANCEL,callback);
}
</script>
</head>
<body>
<table width="1500" height="1000" border="1" bordercolor="#000000">
  <tr>
    <td>　</td>
    <td align="center"><a href="javascript:test()">普通演示</a></td>
    <td>　</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td align="center"><a href="javascript:test1()">回调演示一</a>
    <label></label></td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td align="center"><a href="javascript:test2()">回调演示二
      
    </a></td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td align="center"><a href="javascript:test4()">回调演示三</a><a href="javascript:test3()"></a></td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td align="center"><a href="javascript:test3()">自定义演示
      
    </a></td>
    <td>&nbsp;</td>
  </tr>
</table>
</body>
</html>

提示：您可以先修改部分代码再运行

http://www.qlili.com 个人站帮点啊

TOP

请大家尊重和保护奥运知识产权。

comasp

高级会员

帖子: 390
体力: 692
威望: 0

专长 JS,JSP,UE

4^# 大中小发表于 2008-6-13 22:55

我这有一个分享下：
http://www.cssrain.cn/demo/1/msgbox/MsgBox.html
可以去 http://www.cssrain.cn/article.asp?id=868 下载。
另外你可以搜索
http://www.cssrain.cn/search.asp ... mp;searchType=title

不回帖好了,应该没有广告帖了吧。cssrain.cn

TOP

还在为头像烦恼?还在为不能关注好友动态烦忧?快来蓝色理想家园吧!

togoog [楼主]

天使共舞

高级会员

帖子: 422
体力: 873
威望: 0
当前: 北京海淀区

专长 网页设计,ASP,搜索

5^# 大中小发表于 2008-6-15 16:07

想要2楼朋友那种效果，但是2楼朋友那个对话框可以在工作区以外移动，我想让它只能在工作区里移动。
有没有哪位高手帮忙把我提供的这个MESSAGEBOX程序挖出来啊，我另存不下来。谢谢

www.daming2004.com警告伱~

TOP

togoog [楼主]

天使共舞

高级会员

帖子: 422
体力: 873
威望: 0
当前: 北京海淀区

专长 网页设计,ASP,搜索

6^# 大中小发表于 2008-6-15 20:14

自己再顶一下。有的朋友请不要再藏了，就放出来吧。谢谢

www.daming2004.com警告伱~

TOP

51jsr

新手上路

帖子: 1
体力: 7
威望: 0
当前: 山东青岛
离线: 82 天

7^# 大中小发表于 2008-6-15 23:57

想用JSR的朋友加入我的群：10678909

感谢楼主对JSR的厚爱~~~：）

我的JSR---http://www.51jsr.com

TOP

skybot

size

钻石会员

帖子: 2729
体力: 6424
威望: 6
当前: 上海长宁

专长 JS,C#,MSSQL

8^# 大中小发表于 2008-6-16 12:23

楼主可以看看 ext 的messagebox

http://www.qlili.com 个人站帮点啊

TOP

skybot

size

钻石会员

帖子: 2729
体力: 6424
威望: 6
当前: 上海长宁

专长 JS,C#,MSSQL

9^# 大中小发表于 2008-6-16 12:26

message box URL
http://www.extjs.com/deploy/dev/examples/message-box/msg-box.html

http://www.qlili.com 个人站帮点啊

TOP

togoog [楼主]

天使共舞

高级会员

帖子: 422
体力: 873
威望: 0
当前: 北京海淀区

专长 网页设计,ASP,搜索

10^# 大中小发表于 2008-6-16 13:58

谢谢楼上的朋友，不过ＥＸＴ的有点小问题．如图：
在拖动到最右下角就会出现空白区域．

附件: 您所在的用户组无法下载或查看附件，您需要注册/登录后才能查看！

www.daming2004.com警告伱~

TOP

togoog [楼主]

天使共舞

高级会员

帖子: 422
体力: 873
威望: 0
当前: 北京海淀区

专长 网页设计,ASP,搜索

11^# 大中小发表于 2008-6-16 14:02

我希望在弹出对话框后，滚动条隐藏．对话框结束后滚动条再显示

www.daming2004.com警告伱~

TOP

vinllong

包文龙

初级会员

帖子: 69
体力: 153
威望: 10
当前: 上海浦东
离线: 5 天

专长 前端制作,JSP,MySQL

12^# 大中小发表于 2008-6-27 15:39

我希望在弹出对话框后，滚动条隐藏．对话框结束后滚动条再显示
这个在IE下可以隐藏 FF下是不可以的

TOP

dictionarydxn

新手上路

帖子: 14
体力: 33
威望: 0
离线: 7 天

13^# 大中小发表于 2008-6-27 15:54

楼主的是extjs的效果吧

TOP

dragon924

新手上路

帖子: 8
体力: 22
威望: 0
离线: 23 天

14^# 大中小发表于 2008-7-10 14:29

呵~~~非常好,记录一下

TOP