先讓我們看一個(gè)例子，了解什么是模式化窗口。

以下是QQ秀商城在非登錄時(shí)提示登錄的一種狀態(tài)。當(dāng)我在非登錄狀態(tài)，通過保存形象的方式買一件衣服時(shí)，彈出登錄對(duì)話窗口提示登錄。此時(shí)，登錄對(duì)話窗口鎖定商城頁(yè)，鎖定IE，只有當(dāng)對(duì)登錄窗口進(jìn)行操作后，才能夠進(jìn)行其他操作。譬如：最小化IE、瀏覽商城等。我們可以說，登錄對(duì)話窗口就是一種模式化窗口。

模式化窗口常常給人“壞”的印象，為什么“壞”？是因?yàn)樗伴L(zhǎng)”成那個(gè)樣子？還是因?yàn)樗ǔ６颊f些沒用的話，所以用戶都不看其中的內(nèi)容？如果換成一個(gè)浮動(dòng)層DIV，它就變“好”了？就模式化窗口的形式和“好壞”問題，我們進(jìn)行了討論。

為什么大家會(huì)認(rèn)為它“壞”？
西貝：“以前系統(tǒng)彈出對(duì)話框，用戶看不懂，或者不看，給用戶的印象大多是一種警告。因此感覺很壞，對(duì)用戶來(lái)講，很暴力。”（呵呵，可以引用最近流行的，很陳，很冠希了。）Eele：“當(dāng)我在填一些注冊(cè)信息時(shí)，需要從另外一頁(yè)復(fù)制一些內(nèi)容，這個(gè)時(shí)候彈出alert無(wú)法到另一頁(yè)?！保ㄟ@種情況我也遇到過~~）Hiseven：“以前有一些網(wǎng)站，有bug，彈出‘無(wú)數(shù)’確定對(duì)話框，必須全部確定才能進(jìn)行下一步的操作，于是開始點(diǎn)擊一個(gè)又一個(gè)的確定。”（嗯，尤其是那種讓我點(diǎn)擊連續(xù)的確定，但是不斷彈出確定的那種垃圾網(wǎng)站，讓我?guī)捉罎⒌倪吘墌~）

臭魚：“屏幕上出現(xiàn)不止一個(gè)叉子按鈕，卻只有一個(gè)可以點(diǎn)擊，如photoshop?！?/P>

臭魚：“IE7開始了，所有的瀏覽器都有tabs了。多個(gè)網(wǎng)頁(yè)在一個(gè)瀏覽器中打開，如果在一個(gè)頁(yè)面中出現(xiàn)了模式化窗口，要切換到其他頁(yè)面都做不到了?！?/P>

臭魚：“有的時(shí)候只要提示，不需要操作?！盙mail只提示：

QQ空間上傳成功的模式化窗口:

aaron：“應(yīng)與開發(fā)制定一個(gè)規(guī)范，不一定模式化的東西就差，看情況?！保ㄓ纱艘鱿旅娴脑掝}~~）

模式化窗口分幾類？

A類：3鎖死2，鎖死1，不完成3的操作，就不能進(jìn)行其他操作。
B類：3鎖死2，但不鎖死1。（1通常是IE瀏覽器）
C類：彈出3，可以進(jìn)行2的操作和1上的其他操作。

什么情況下需要A類的，什么情況下需要B類的，什么情況下需要C類的？

aaron：“格式化磁盤，二次確認(rèn)時(shí)需要A類?！?西貝：“與下頁(yè)的操作息息相關(guān)，不進(jìn)行判斷，下步操作就不能進(jìn)行操作時(shí)，需要A類?！?臭魚：“對(duì)網(wǎng)頁(yè)來(lái)講，當(dāng)前頁(yè)鎖定即可，不用alert鎖定整個(gè)瀏覽器。屬于B類” Hiseven：“對(duì)于網(wǎng)頁(yè)來(lái)講，都可以改成C類的形式，不用那么暴力?！?Hiseven：“A類，在操作過程中，如安裝，有取消按鈕必須很明確。在C類形式，如QQ秀中“身上品”，有叉的形式表示關(guān)閉，不需要取消?！?/P>

小結(jié)一下：暫且把模式化窗口分為A類、B類和C類，A類比B類和C類要暴力，但是更安全。B類和C類更容易讓用戶操作。通常A類都用于非常重要的信息時(shí)使用。歡迎大家進(jìn)行補(bǔ)充~

原文：http://webteam.tencent.com/?p=894