$.extend({
alert:function(html,callback){
var dialog=new Dialog();
dialog.build('alert',callback,html);
},
confirm:function(html,callback){
var dialog=new Dialog();
dialog.build('confirm',callback,html);
}
});
调用方法：
复制代码 代码如下:
$.confirm('确定删除？',function(){
alert('cccc');
});
复制代码 代码如下:
div.alertParent{
padding:6px;
background:#ccc;
background:rgba(201,201,201,0.8);
width:auto;
position:absolute;
-moz-border-radius:3px;
font-size:12px;
top:50px;
left:50px;
}
div.alertContent{
background:#fff;
width:350px;
height:auto;
border:1px solid #999;
}
h2.title{
width:100%;
height:28px;
background:#0698E9;
text-indent:10px;
font-size:12px;
color:#fff;
line-height:28px;
margin:0;
}
div.alertHtml{
background:url(dtips.gif) 0 0 no-repeat;
height:50px;
margin:10px;
margin-left:30px;
text-indent:50px;
line-height:50px;
font-size:14px;
}
div.btnBar{
border-top:1px solid #c6c6c6;
background:#f8f8f8;
height:30px;
}
div.btnBar input{
background:url(sure.png) no-repeat;
border:0;
width:63px;
height:28px;
float:right;
margin-right:5px;
}
html
复制代码 代码如下:
<div><BR><div><BR><h2>系统提示</h2><BR><div><BR>你的操作出现错误！<BR></div><BR> <div><BR> <input
type="button" value="确定"/><BR></div><BR></div><BR> </div><BR>
高手勿笑，为了说明实现的方式，我并没有仔细的去完善这段代码，仅仅是在写作的半小时内写出的，所以有很多地方没有去思考，有很多的纰漏，并且以一个比较笨的方式实现了这个模拟的alert，不过下次我们将通过构建Button的方式实现一个组件，会加入遮罩，ajax调用，iframe宽度高度自适应等更强大的功能。
您可能感兴趣的文章: