基于jQuery的消息提示插件之旅 DivAlert(三)

316 阅读 0 评论 209 点赞

我是靠谱客的博主平常纸鹤，最近开发中收集的这篇文章主要介绍基于jQuery的消息提示插件之旅 DivAlert(三)，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

本版本遵循了2.0的写法，此处通过extend方法封装了需要设置的各个选项，比起2.0版本的代码要精简了一些。
　　
2.0版本

复制代码代码如下:

 
//设置插件基本信息 
var options = o || {}; 
options.width = o.width || 300; 
//提示框宽度若小于104px则自动重置为200px 
if (options.height > 104) { 
options.height = o.height; 
} else { 
options.height = 200; 
} 
options.title = o.title || "提示标题"; 
options.content = o.content || "提示内容"; 
//与css文件结合，方便在外部自定义样式而不用改写js文件 
options.bgClass = o.bgClass || 'jBg'; 
options.wrapClass = o.wrapClass || 'jWrap'; 
options.titClass = o.titClass || 'jTit'; 
options.conClass = o.conClass || 'jCon'; 
options.clsClass = o.clsClass || 'jBtn'; 
options.botDivClass = o.botDivClass || 'jBot'; 
options.botBtnClass = o.botBtnClass || 'jBotBtn'; 

3.0版本

复制代码代码如下:

 
//设置插件基本信息 
var settings = { 
width: 300, 
height: 200, 
title: "提示标题", 
content: "提示内容", 
bgClass: 'jBg', 
wrapClass: 'jWrap', 
titClass: 'jTit', 
conClass: 'jCon', 
clsClass: 'jBtn', 
botDivClass: 'jBot', 
botBtnClass: 'jBotBtn' 
}; 
$.extend(settings, options); 

　　都是些很基础的东西，不过还是打个包吧，有兴趣的可以下来瞧瞧。。。
完整代码打包下载

作者：Rocky翔(cnblogs)
感谢作者的代码，脚本之家编辑简单的说明下，从刚开始的第一版的不完善到完善，都是一步一步过来的，开始没有什么是完美的，经过参考别人的代码，学习别人的长处，慢慢的就会让你的程序更完善，建议大家在以后学习的过程中，多参考多写，不要只看不动手，多多动手自己写代码，才能真正的学习到知识，发现自己的不足。
下面附上作者前两期发布的文章
基于jQuery的弹出消息插件 DivAlert之旅（一）

基于jQuery的消息提示插件 DivAlert之旅（二）

基于jQuery的消息提示插件 DivAlert之旅（三）推荐