快捷導(dǎo)航

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

更新時(shí)間：2010年04月01日 22:59:51 作者：

雖然前面已經(jīng)寫(xiě)過(guò)兩篇關(guān)于DivAlert的隨筆了，也已經(jīng)實(shí)現(xiàn)了我的需求，但是今天發(fā)現(xiàn)很多jQuery插件代碼中都使用了extend方法，這樣確實(shí)讓默認(rèn)設(shè)置的代碼減少了許多。

本版本遵循了2.0的寫(xiě)法，此處通過(guò)extend方法封裝了需要設(shè)置的各個(gè)選項(xiàng)，比起2.0版本的代碼要精簡(jiǎn)了一些。
　　
2.0版本

復(fù)制代碼代碼如下:

 
//設(shè)置插件基本信息 
var options = o || {}; 
options.width = o.width || 300; 
//提示框?qū)挾热粜∮?04px則自動(dòng)重置為200px 
if (options.height > 104) { 
options.height = o.height; 
} else { 
options.height = 200; 
} 
options.title = o.title || "提示標(biāo)題"; 
options.content = o.content || "提示內(nèi)容"; 
//與css文件結(jié)合，方便在外部自定義樣式而不用改寫(xiě)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版本

復(fù)制代碼代碼如下:

 
//設(shè)置插件基本信息 
var settings = { 
width: 300, 
height: 200, 
title: "提示標(biāo)題", 
content: "提示內(nèi)容", 
bgClass: 'jBg', 
wrapClass: 'jWrap', 
titClass: 'jTit', 
conClass: 'jCon', 
clsClass: 'jBtn', 
botDivClass: 'jBot', 
botBtnClass: 'jBotBtn' 
}; 
$.extend(settings, options); 

　　都是些很基礎(chǔ)的東西，不過(guò)還是打個(gè)包吧，有興趣的可以下來(lái)瞧瞧。。。
完整代碼打包下載

作者：Rocky翔(cnblogs)
感謝作者的代碼，腳本之家編輯簡(jiǎn)單的說(shuō)明下，從剛開(kāi)始的第一版的不完善到完善，都是一步一步過(guò)來(lái)的，開(kāi)始沒(méi)有什么是完美的，經(jīng)過(guò)參考別人的代碼，學(xué)習(xí)別人的長(zhǎng)處，慢慢的就會(huì)讓你的程序更完善，建議大家在以后學(xué)習(xí)的過(guò)程中，多參考多寫(xiě)，不要只看不動(dòng)手，多多動(dòng)手自己寫(xiě)代碼，才能真正的學(xué)習(xí)到知識(shí)，發(fā)現(xiàn)自己的不足。
下面附上作者前兩期發(fā)布的文章
基于jQuery的彈出消息插件 DivAlert之旅（一）

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

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

您可能感興趣的文章: