“模態(tài)”對(duì)話框和“后退”按鈕

各位，你們?cè)跒g覽網(wǎng)站的時(shí)候還能看到“模態(tài)”對(duì)話框嗎？（不是那種模擬的，是真實(shí)的用showModalDialog這個(gè)破玩意兒?jiǎn)境鰜?lái)的）。你肯定說(shuō)，現(xiàn)在那個(gè)網(wǎng)站還敢這么做呢，不是不相干了就是流氓網(wǎng)站吧，要不就是開(kāi)發(fā)者是一群小白。OK，那么您在瀏覽網(wǎng)頁(yè)的時(shí)候用“后退”按鈕的次數(shù)多嗎？甚至于依賴后退按鈕的功能嗎？這是一個(gè)真實(shí)的事情，關(guān)于“模態(tài)”對(duì)話框和“后退”按鈕的事情。 對(duì)于showModalDialog這個(gè)API，你是不是已經(jīng)忘記他很久了，或者你直接告訴我：“這個(gè)API我根本就沒(méi)有看過(guò)。“那我真是要恭喜你。不僅各個(gè)瀏覽器對(duì)其支持不一，行為也不太相同。就算是Modal的最徹底的Internet Explorer，也會(huì)有很多莫名其妙的問(wèn)題。例如，如果你從一個(gè)modal Dialog中使用 window.open 打開(kāi)一個(gè)新的窗體，恰巧你用的是IE6，或者使用了 –nomerge 參數(shù)啟動(dòng)的高版本 IE，那么可能這個(gè)新的窗口和 modal Dialog 處于不同的 session，其 cookie 顯然也都是空的。如果你的這個(gè)鏈接需要 Authentication，那么這個(gè)新的窗口肯定通不

各位，你們?cè)跒g覽網(wǎng)站的時(shí)候還能看到“模態(tài)”對(duì)話框嗎？（不是那種模擬的，是真實(shí)的用showModalDialog這個(gè)破玩意兒?jiǎn)境鰜?lái)的）。你肯定說(shuō)，現(xiàn)在那個(gè)網(wǎng)站還敢這么做呢，不是不想干了就是流氓網(wǎng)站吧，要不就是開(kāi)發(fā)者是一群小白。OK，那么您在瀏覽網(wǎng)頁(yè)的時(shí)候用“后退”按鈕的次數(shù)多嗎？甚至于依賴后退按鈕的功能嗎？這是一個(gè)真實(shí)的事情，關(guān)于“模態(tài)”對(duì)話框和“后退”按鈕的事情。

對(duì)于showModalDialog這個(gè)API，你是不是已經(jīng)忘記他很久了，或者你直接告訴我：“這個(gè)API我根本就沒(méi)有看過(guò)。“那我真是要恭喜你。不僅各個(gè)瀏覽器對(duì)其支持不一，行為也不太相同。就算是Modal的最徹底的Internet Explorer，也會(huì)有很多莫名其妙的問(wèn)題。例如，如果你從一個(gè)modal Dialog中使用 window.open 打開(kāi)一個(gè)新的窗體，恰巧你用的是IE6，或者使用了 –nomerge 參數(shù)啟動(dòng)的高版本 IE，那么可能這個(gè)新的窗口和 modal Dialog 處于不同的 session，其 cookie 顯然也都是空的。如果你的這個(gè)鏈接需要 Authentication，那么這個(gè)新的窗口肯定通不過(guò)。QA會(huì)非常Kind的給你分配一個(gè)BUG編號(hào)；又例如，你可能發(fā)現(xiàn)使用不同權(quán)限的用戶登錄操作系統(tǒng) Modal Dialog 的地址欄的顯示與否是不一樣的；又例如，你可能發(fā)現(xiàn)在 Modal Dialog下你沒(méi)有辦法用 Ctrl+C 復(fù)制文本！這些問(wèn)題你可能會(huì)遇到，你可能不會(huì)遇到，如果你遇到了，相信你的心情一定不會(huì)太好。

對(duì)于用戶來(lái)說(shuō)心情肯定更不好，（我仍舊以Internet Explorer為例，因?yàn)樗攀钦嬲?modal，你說(shuō)我是不是瘋了？對(duì)不起，這個(gè)系統(tǒng)需要承諾支持IE6、7、8、9、將來(lái)還有Firefox、Chrome、Safari，是不是很牛？），用戶已經(jīng)習(xí)慣了用多個(gè)Tab頁(yè)面進(jìn)行瀏覽，現(xiàn)在一個(gè)頁(yè)面彈出出了一個(gè)Modal Dialog，令所有的其他頁(yè)面全部都停止響應(yīng)了，那心情怎叫一個(gè)爽字了得。那么這個(gè)網(wǎng)站是不是會(huì)遭到用戶的拋棄呢？不會(huì)的。不但不會(huì)，用戶還會(huì)屏氣凝神的在 Modal Dialog中把他/她該干的事情干完，小心翼翼的關(guān)掉它，然后再去瀏覽那些剛才被 Modal Dialog Disable掉的頁(yè)面。這是為什么呢？因?yàn)樗谑褂靡粋€(gè) E-Learning 系統(tǒng)。

好吧，說(shuō)到 E-Learning 系統(tǒng)，最常想到的就是考試（對(duì)不起，還是叫測(cè)驗(yàn)吧，因?yàn)榛?Web 的系統(tǒng)，根本放不了作弊）啊，問(wèn)卷啊這些東西。這些東西有什么不一樣呢？他內(nèi)部狀態(tài)特別豐富。拿考試來(lái)說(shuō)吧，有一些考試只能夠單向作答，也就是你提交了一個(gè)答案那你想后悔可就來(lái)不及了；有一些考試是有總體時(shí)間限制的；有一些考試做了一道題還會(huì)給你彈出一個(gè)解釋層，告訴你你到底是為什么錯(cuò)的；還有一些和心理測(cè)驗(yàn)一樣，你第2道提選C，那么你就會(huì)跳到第4道題，第三道題是不許做的。凡此云云。你說(shuō)，這種東西最怕什么呢？要我說(shuō)，最怕的東西莫過(guò)于“刷新”和“后退”，實(shí)際上，刷新操作的處理還算比較容易，因?yàn)樘峤灰坏李}的答案，這種東西是沒(méi)有狀態(tài)的刷就刷把，至于客戶端那些內(nèi)部狀態(tài)的保持……總之你還能夠想些招數(shù)出來(lái)，那么再加上“后退”呢？我覺(jué)得除非你把所有的狀態(tài)全都移動(dòng)到服務(wù)端去，否則你的客戶端腳本可能真是有點(diǎn)兒不好辦了（我們更倒霉，還遇上了腳本錯(cuò)誤，這肯定是在設(shè)計(jì)的時(shí)候考慮不夠的原因）。

我們可以發(fā)揮一下想象力，考慮一下我們“專(zhuān)業(yè)”的瀏覽器使用習(xí)慣，然后說(shuō)，沒(méi)關(guān)系，告訴用戶，別用“刷新”（F5）和后退（Alt+<-），我告訴你，用戶在稍微感受到一點(diǎn)延遲的時(shí)候就喜歡F5，在頁(yè)面加載緩慢的時(shí)候就希望（Alt + <-）。好吧，退一百步，你自覺(jué)到真的不會(huì)使用刷新或者后退。但是你在瀏覽器的文本框里正在發(fā)表長(zhǎng)篇大論的時(shí)候，突然發(fā)現(xiàn)自己輸錯(cuò)了一個(gè)字母，下意識(shí)的按了一下 Backspace，卻發(fā)現(xiàn)，“靠”頁(yè)面后退了。你遇到過(guò)嗎？我遇到過(guò)好多回了。

又有“專(zhuān)業(yè)”人員說(shuō)，我還可以按F12，改改你的客戶端腳本，那么我可以想做多長(zhǎng)時(shí)間就做多長(zhǎng)時(shí)間（假設(shè)你的服務(wù)端沒(méi)有追蹤時(shí)間），想看答案就看答案（假設(shè)你的客戶端 load 了不該 load 的信息）。于是綜合考慮之下，一個(gè)無(wú)比英明的決定就做出了：用模態(tài)。但是在模態(tài)下，有一些客戶端行為又和非模態(tài)不太一致怎么辦，有一個(gè)無(wú)比英明的決定做出了，用 Flash或者Silverlight。于是一個(gè)在 Modal Dialog 中用 Flash或者 Silverlight展示的頁(yè)面就出現(xiàn)在了用戶的面前。

過(guò)了一些日子，手機(jī)和便攜客戶端（例如xxxPad，xxxface）開(kāi)始風(fēng)靡，Web應(yīng)用追風(fēng)搬的竄上了這些設(shè)備。這些設(shè)備更牛，不僅沒(méi)有什么Modal的東西，而且后退按鈕更人性，比如UCxxx，這瀏覽器的后退按鈕大部分情況直接走緩存（我很感謝這個(gè)功能，節(jié)省我很多流量），但是這讓E-Learning情何以堪啊。你說(shuō)，一般人，拿著手機(jī)走在大馬路上，還做著題，現(xiàn)實(shí)嗎？我說(shuō)你說(shuō)的很對(duì)，但是現(xiàn)在我只做的起Web，我做不起App。那怎么辦呢？應(yīng)該差異化，讓手機(jī)干手機(jī)上應(yīng)該干的事情，那就是看；讓有鍵盤(pán)鼠標(biāo)可以精確操控的干他們呢應(yīng)該干的事情，那就是寫(xiě)。很可惜，決定產(chǎn)品的人不是我。

各位，你們有沒(méi)有遇到過(guò)Modal和后退按鈕的煩惱呢？你是怎么處理的呢？