彈出層提示信息，這是移動前端開發(fā)中最常見的需求，你可能會想到一些流行的彈框插件，比如 經(jīng)典的artDialog 炫酷的Sweetalert等等..
但是慢慢地你其實會發(fā)現(xiàn)通常情況下需求定制化要求較高，一般的彈框插件可能只滿足大部分要求，自定義花的時間還不如手動自己封裝一個符合自己開發(fā)習(xí)慣的彈框組件，這樣后續(xù)開發(fā)效率將大大提高。
首先整理一下思路，原生javascript其實是有實現(xiàn)alert()方法的，但是那個會暫時性中斷程序運(yùn)行，并且足以讓你丑拒！那么拋開這些細(xì)細(xì)一想，其實彈框就是兩個div層，一個浮在底下的蒙層（遮罩層），將所有的元素遮起來，并且最好是半透明。另一個就是彈框主體部分了，一般情況需要水平垂直居中，并且通常包含標(biāo)題，主體內(nèi)容需要可定制，如果是模態(tài)框通常還有確認(rèn)/取消按鈕。最后就是彈出、關(guān)閉的時候一些動效。
所以說完全可以自己封裝一個，然后放在項目中公共js中去。能自己手寫的盡量不用插件....
一些默認(rèn)屬性值
通過一個foreach循環(huán)，類似于傳入的opts繼承了defaultOpts屬性，在調(diào)用彈框之前執(zhí)行的before()方法，相當(dāng)于一些準(zhǔn)備工作
defaultOpts ='',
content: '',
height: 50,
width: 80,
type: 'alert-default',
effect: 'fadeIn',
&n
延伸閱讀
- ssh框架
2016-09-30
- 阿里移動安全 [無線安全]玩轉(zhuǎn)無線電——不安全的藍(lán)牙鎖
2017-07-26
- 消息隊列NetMQ 原理分析4-Socket、Session、Option和Pipe
2024-03-26
- Selective Search for Object Recognition 論文筆記【圖片目標(biāo)分割】
2017-07-26
- 詞向量-LRWE模型-更好地識別反義詞同義詞
2017-07-26
- 從棧不平衡問題 理解 calling convention
2017-07-26
- php imagemagick 處理 圖片剪切、壓縮、合并、插入文本、背景色透明
2017-07-26
- Swift實現(xiàn)JSON轉(zhuǎn)Model - HandyJSON使用講解
2017-07-26
- 阿里移動安全 Android端惡意鎖屏勒索應(yīng)用分析
2017-07-26
- 集合結(jié)合數(shù)據(jù)結(jié)構(gòu)來看看(二)
2017-07-26
學(xué)習(xí)是年輕人改變自己的最好方式