|
AsyncBox是一款比較好用的JS彈窗插件,，雖然目前官網(wǎng)已經(jīng)宣布重構(gòu)改善，但在快速和不復(fù)雜的開發(fā)中,，還是一款比較好用的插件,。
AsyncBox（異步盒子）是基于 jQuery 的彈窗插件。能夠?qū)崿F(xiàn)網(wǎng)站的整體風(fēng)格效果,，給用戶一個(gè)新的視覺享受,。主要模擬常用的 alert、confirm,、prompt,、open 和擴(kuò)展了一些對(duì)話框。它通過回調(diào)函數(shù)觸發(fā)事件動(dòng)作并執(zhí)行,，使操作區(qū)域更加明了,、統(tǒng)一。而且能夠在主流瀏覽器中靈活運(yùn)用,。
AsyncBox主要有以下特點(diǎn)：
一,、AysncBox 集成了 alert、confirm,、prompt,、open 和擴(kuò)展了一些對(duì)話框；
二,、支持靜止定位,、自定義位置、自動(dòng)修復(fù)位置,。極大的靈活性,；
三、支持無限極層疊 iframe 框架或 frameset 框架集調(diào)用,；
四,、調(diào)用方式簡單，API齊全；
五,、支持IE6及大多數(shù)瀏覽器,；
六、支持皮膚,。
由于目前官網(wǎng)已經(jīng)宣布重構(gòu)改善,，所以AsyncBox目前最新的版本是[2011-9-15] AsyncBox v1.4.5，讓我們?nèi)タ纯此钚碌母氯罩荆?/p>
- 新增
1,、增加 HTML 模式中顯示 DOM 元素內(nèi)容的支持,。
- 調(diào)整
1、修改了拖動(dòng)算法,，減少窗口因?yàn)楸幌拗圃诳梢暦秶鷥?nèi)對(duì)頁面的遮擋,。
2、去除了對(duì)話框類與內(nèi)容窗口中 $ 的部分簡寫支持,，以免發(fā)生沖突,。
3、去掉了對(duì)話框類左上角的圖標(biāo),。
4,、open 中 url 模式彈出的頁面中無需加 top。
- 修復(fù)
1,、修復(fù)窗口大于瀏覽器可見范圍時(shí)看不到標(biāo)題的 BUG,。
2、修復(fù) IE6 下,，某些窗口無法遮住 select 的 BUG。
3,、修復(fù) url 與 data 參數(shù)配合時(shí)最終拼接錯(cuò)誤的 BUG,。
- 更名
參數(shù)配置：
1、Fixed 為 open 私有,且更名為 fixed,。
2,、autoReset 為 open 私有,且更名為 reset。
3,、icon 為 open 私有,，且更名為 logo。
4,、clone 歸為 drag ,，在 drag : { clone : true } 使用。
輔助函數(shù)：
1,、$.box() 方法更名為 $.opener(),。
2、$.asyncbox() 更名為 $.exist()。
3,、$.iframe() 更名為 $.framer(),。
open選項(xiàng)：
1、scrolling 更名為 scroll,。
2,、closeType 更名為 cache。
可以看出,，AysncBox 的功能還是很全,，很實(shí)用的。雖然目前停止更新,，但應(yīng)用于項(xiàng)目當(dāng)中可以說是沒什么問題的,。
常見問題：
- 可以在項(xiàng)目中使用 AsyncBox 嗎？
-
可以,。在遵循相關(guān)協(xié)議的條件下,，AsyncBox 無償?shù)奶峁┙o大家永久免費(fèi)使用權(quán)。
- 為什么在調(diào)用 AsyncBox 時(shí)中文會(huì)出現(xiàn)亂碼,？
-
AsyncBox 的文件編碼是 UTF-8 的,，在遇到其他編碼類型時(shí)可能會(huì)出現(xiàn)亂碼現(xiàn)象，解決辦法可以在引用 AsyncBox 時(shí)加上 charset=”utf-8″,。例如：<script type=”text/javascript” src=”AsyncBox.js” charset=”utf-8″></script>
- 為什么 AsyncBox 不支持“if(asyncbox.confirm(‘Are you ok?’)){…}else{…}”這種判斷方式,？
-
AsyncBox 對(duì)事件的操作是通過回調(diào)函數(shù)實(shí)現(xiàn)的，模擬不了阻塞,，所以無法支持這種調(diào)用方式,。
- 為什么 AsyncBox 不支持“最大化”？
-
很遺憾,，在歷來更新 AsyncBox 中都沒有提到支持“最大化”,，但是可以通過 width、height 配置一個(gè)全屏的窗口,，在 resize 中使用 $.size 修復(fù),。這樣至少可以彌補(bǔ)一下缺陷。另外 AsyncBox 當(dāng)然不會(huì)放棄這個(gè)支持,，在往后的版本中將看到,。
- AsyncBox 支持 IPAD 移動(dòng)設(shè)備瀏覽嗎？
-
目前 AsyncBox 對(duì)手機(jī)瀏覽產(chǎn)生的不理想效果沒有做相關(guān)定制,。不建議在 IPAD 移動(dòng)設(shè)備中使用 AsyncBox 集成開發(fā),。
- 為什么 AsyncBox 在 windows 7 系統(tǒng)下字體會(huì)顯得很粗糙？
-
系統(tǒng)本身對(duì)中文字體的解析就那樣,。如果想達(dá)到更理想的視覺效果,，可以了解相關(guān)的系統(tǒng)美化資源,。
- 為什么 AsyncBox 在內(nèi)容頁中不能第一時(shí)間直接調(diào)用？
-
在內(nèi)容頁或者在 iframe 內(nèi)中不需要事件觸發(fā)調(diào)用 AsyncBox 時(shí),，例如“parent.asyncbox.alert(‘Hello AsyncBox !’);”,，這樣會(huì)報(bào)“缺少對(duì)象”的錯(cuò)誤，原因是內(nèi)容頁未加載完畢,。解決方案為：setTimeout(function(){parent.asyncbox.alert(‘Hello AsyncBox !’);},1000); 推薦延遲加載,，盡量避免 AsyncBox 和頁面同時(shí)加載，既等頁面加載完畢后再彈出也不遲,。
- 為什么在項(xiàng)目中載入 AsyncBox 后窗口布局會(huì)變得凌亂,？
-
AsyncBox 的構(gòu)建內(nèi)核使用了 table 和 部分 a 標(biāo)簽，如果你對(duì) table 和 a 標(biāo)簽進(jìn)行了全局樣式設(shè)置的話,，可能會(huì)對(duì) AsyncBox 造成影響,。雖然 AsyncBox 也內(nèi)置固化了部分樣式，但總的來說設(shè)置全局樣式并不是很好的編碼習(xí)慣,，所以建議盡量避免定義全局樣式的寫法,。
- 為什么對(duì)話框的內(nèi)容不能換行？
-
避免內(nèi)容出現(xiàn)連續(xù)沒有空格的字符串,，如 “StringStringStringStringStringStringString…”,。
- 為什么 AsyncBox 不能遮住 FLASH？
-
FLASH 相對(duì)比較特殊,，如果需要遮住它的話,，由開發(fā)人員決定在引用 FLASH 時(shí)是否加入 <param name=”WMode” value=”Transparent”> 參數(shù)。
- 為什么 AsyncBox 出現(xiàn)靠左上角,，不能拖動(dòng),？
-
缺少文檔聲明<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www./TR/xhtml1/DTD/xhtml1-transitional.dtd”>。另外,，避免在聲明頂部出現(xiàn) UFO,。
- 為什么透明類的皮膚在 IE6 下顯示不出來？
-
AsyncBox 目前就內(nèi)置了一款 ZCMS 的透明皮膚,，在 IE6 下需要對(duì) asyncbox.css 文件中注釋為 /*ie6 filter*/ 下的路徑做絕對(duì)于當(dāng)前頁面的路徑配置。例如：src=’asyncbox/skins/ZCMS/images/ie6/dialog_lt.png’,，asyncbox.html && asyncbox文件夾,，即文檔頁面與 asyncbox 文件夾呈同級(jí)目錄。
- 為什么出現(xiàn) “asyncbox 未定義”或者其他未定義錯(cuò)誤,？
-
出現(xiàn)此類錯(cuò)誤,，請(qǐng)檢查你配置的插件路徑是否正確。
- 為什么按鈕按下后變?yōu)椴豢捎脿顟B(tài)了,？
-
按鈕做了 disabled 處理,，簡單保證了事件單次執(zhí)行,，避免重復(fù)執(zhí)行。執(zhí)行完畢后會(huì)變?yōu)榭捎脿顟B(tài),。如果按鈕按下后變?yōu)椴豢捎?，那說明在執(zhí)行的過程中出錯(cuò)了，請(qǐng)檢查你的代碼,。
- 為什么會(huì)報(bào) “缺少標(biāo)識(shí)符,、字符串或數(shù)字” 或 “未結(jié)束的字符串常量”？
-
IE 下在配置 $.open(…) 參數(shù)時(shí)避免參數(shù)配置中缺少逗號(hào)或者最后一個(gè)參數(shù)后面出現(xiàn)逗號(hào),。
- CHM 幫助文檔無法顯示,？
-
關(guān)于 CHM 幫助文檔無法顯示問題，由于系統(tǒng)安全性的影響,，可能會(huì)造成某些 CHM 幫助文檔無法顯示頁面內(nèi)容,。
-
解決方法：
-
1）右鍵文檔 – 解除鎖定。
-
2）打開文檔時(shí)選擇“運(yùn)行”,。
-
如還未能解決就百度或谷歌了,。
- AsyncBox 關(guān)閉不了或關(guān)閉不“完整”？
-
檢查是否存在相同的ID,。
操作流程遇到的問題：
- 如何取得當(dāng)前 AsyncBox 窗口ID,？
-
AsyncBox 的回調(diào)函數(shù)處理機(jī)制為 callback 在 callback 中可以使用 this.id 得到當(dāng)前 AsyncBox 的 ID。如果該 AsyncBox 被嵌套使用,，那么 this 對(duì)象會(huì)被子 AsyncBox 覆蓋,，此時(shí)需得到正確的 ID ，則需將 this 對(duì)象存起來,，例如：var id = this.id; 再用,。 另外對(duì)話框類窗口ID為 asyncbox_ + [alert,confirm,success,error,prompt]。
- 如何在 AsyncBox 窗口中提交表單,？
-
可以用自帶的按鈕操作子頁面,，也可以在子頁面中自己新建按鈕，但記住的是：頁面刷新的話就調(diào)用不了部分JS了,。
- 操作 AsyncBox 后如何刷新頁面,？
-
在判斷 action 值內(nèi)加入需要刷新頁面的代碼“window.location.reload()”。內(nèi)容頁刷新父頁面：“top.window.location.reload()”,。
- 如何在程序后臺(tái)中調(diào)用 AsyncBox,？
-
通過 AJAX。
官網(wǎng)：http://
轉(zhuǎn)載請(qǐng)注明：前端領(lǐng)域 ? JavaScript插件推薦：AsyncBox,，輕量級(jí)彈窗插件
|
