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

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

模式化窗口常常給人“壞”的印象，為什么“壞”？是因為它“長”成那個樣子？還是因為它通常都說些沒用的話，所以用戶都不看其中的內容？如果換成一個浮動層DIV，它就變“好”了？就模式化窗口的形式和“好壞”問題，我們進行了討論。

為什么大家會認為它“壞”？
西貝：“以前系統彈出對話框，用戶看不懂，或者不看，給用戶的印象大多是一種警告。因此感覺很壞，對用戶來講，很暴力。”（呵呵，可以引用最近流行的，很陳，很冠希了。）Eele：“當我在填一些注冊信息時，需要從另外一頁復制一些內容，這個時候彈出alert無法到另一頁。”（這種情況我也遇到過~~）Hiseven：“以前有一些網站，有bug，彈出‘無數’確定對話框，必須全部確定才能進行下一步的操作，于是開始點擊一個又一個的確定。”（嗯，尤其是那種讓我點擊連續的確定，但是不斷彈出確定的那種垃圾網站，讓我幾近崩潰的邊緣~~）

臭魚：“屏幕上出現不止一個叉子按鈕，卻只有一個可以點擊，如photoshop。”

臭魚：“IE7開始了，所有的瀏覽器都有tabs了。多個網頁在一個瀏覽器中打開，如果在一個頁面中出現了模式化窗口，要切換到其他頁面都做不到了。”

臭魚：“有的時候只要提示，不需要操作。”Gmail只提示：

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

aaron：“應與開發制定一個規范，不一定模式化的東西就差，看情況。”（由此引出下面的話題~~）

模式化窗口分幾類？

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

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

aaron：“格式化磁盤，二次確認時需要A類。” 西貝：“與下頁的操作息息相關，不進行判斷，下步操作就不能進行操作時，需要A類。” 臭魚：“對網頁來講，當前頁鎖定即可，不用alert鎖定整個瀏覽器。屬于B類” Hiseven：“對于網頁來講，都可以改成C類的形式，不用那么暴力。” Hiseven：“A類，在操作過程中，如安裝，有取消按鈕必須很明確。在C類形式，如QQ秀中“身上品”，有叉的形式表示關閉，不需要取消。”

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

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