• “模态”对话框和“后退”按钮


    各位,你们在浏览网站的时候还能看到“模态”对话框吗?(不是那种模拟的,是真实的用showModalDialog这个破玩意儿唤出来的)。你肯定说,现在那个网站还敢这么做呢,不是不想干了就是流氓网站吧,要不就是开发者是一群小白。OK,那么您在浏览网页的时候用“后退”按钮的次数多吗?甚至于依赖后退按钮的功能吗?这是一个真实的事情,关于“模态”对话框和“后退”按钮的事情。

    对于showModalDialog这个API,你是不是已经忘记他很久了,或者你直接告诉我:“这个API我根本就没有看过。“那我真是要恭喜你。不仅各个浏览器对其支持不一,行为也不太相同。就算是Modal的最彻底的Internet Explorer,也会有很多莫名其妙的问题。例如,如果你从一个modal Dialog中使用 window.open 打开一个新的窗体,恰巧你用的是IE6,或者使用了 –nomerge 参数启动的高版本 IE,那么可能这个新的窗口和 modal Dialog 处于不同的 session,其 cookie 显然也都是空的。如果你的这个链接需要 Authentication,那么这个新的窗口肯定通不过。QA会非常Kind的给你分配一个BUG编号;又例如,你可能发现使用不同权限的用户登录操作系统 Modal Dialog 的地址栏的显示与否是不一样的;又例如,你可能发现在 Modal Dialog下你没有办法用 Ctrl+C 复制文本!这些问题你可能会遇到,你可能不会遇到,如果你遇到了,相信你的心情一定不会太好。

    对于用户来说心情肯定更不好,(我仍旧以Internet Explorer为例,因为它才是真正的 modal,你说我是不是疯了?对不起,这个系统需要承诺支持IE6、7、8、9、将来还有Firefox、Chrome、Safari,是不是很牛?),用户已经习惯了用多个Tab页面进行浏览,现在一个页面弹出出了一个Modal Dialog,令所有的其他页面全部都停止响应了,那心情怎叫一个爽字了得。那么这个网站是不是会遭到用户的抛弃呢?不会的。不但不会,用户还会屏气凝神的在 Modal Dialog中把他/她该干的事情干完,小心翼翼的关掉它,然后再去浏览那些刚才被 Modal Dialog Disable掉的页面。这是为什么呢?因为他在使用一个 E-Learning 系统。

    好吧,说到 E-Learning 系统,最常想到的就是考试(对不起,还是叫测验吧,因为基于 Web 的系统,根本放不了作弊)啊,问卷啊这些东西。这些东西有什么不一样呢?他内部状态特别丰富。拿考试来说吧,有一些考试只能够单向作答,也就是你提交了一个答案那你想后悔可就来不及了;有一些考试是有总体时间限制的;有一些考试做了一道题还会给你弹出一个解释层,告诉你你到底是为什么错的;还有一些和心理测验一样,你第2道提选C,那么你就会跳到第4道题,第三道题是不许做的。凡此云云。你说,这种东西最怕什么呢?要我说,最怕的东西莫过于“刷新”和“后退”,实际上,刷新操作的处理还算比较容易,因为提交一道题的答案,这种东西是没有状态的刷就刷把,至于客户端那些内部状态的保持……总之你还能够想些招数出来,那么再加上“后退”呢?我觉得除非你把所有的状态全都移动到服务端去,否则你的客户端脚本可能真是有点儿不好办了(我们更倒霉,还遇上了脚本错误,这肯定是在设计的时候考虑不够的原因)。

    我们可以发挥一下想象力,考虑一下我们“专业”的浏览器使用习惯,然后说,没关系,告诉用户,别用“刷新”(F5)和后退(Alt+<-),我告诉你,用户在稍微感受到一点延迟的时候就喜欢F5,在页面加载缓慢的时候就希望(Alt + <-)。好吧,退一百步,你自觉到真的不会使用刷新或者后退。但是你在浏览器的文本框里正在发表长篇大论的时候,突然发现自己输错了一个字母,下意识的按了一下 Backspace,却发现,“靠”页面后退了。你遇到过吗?我遇到过好多回了。

    又有“专业”人员说,我还可以按F12,改改你的客户端脚本,那么我可以想做多长时间就做多长时间(假设你的服务端没有追踪时间),想看答案就看答案(假设你的客户端 load 了不该 load 的信息)。于是综合考虑之下,一个无比英明的决定就做出了:用模态。但是在模态下,有一些客户端行为又和非模态不太一致怎么办,有一个无比英明的决定做出了,用 Flash或者Silverlight。于是一个在 Modal Dialog 中用 Flash或者 Silverlight展示的页面就出现在了用户的面前。

    过了一些日子,手机和便携客户端(例如xxxPad,xxxface)开始风靡,Web应用追风搬的窜上了这些设备。这些设备更牛,不仅没有什么Modal的东西,而且后退按钮更人性,比如UCxxx,这浏览器的后退按钮大部分情况直接走缓存(我很感谢这个功能,节省我很多流量),但是这让E-Learning情何以堪啊。你说,一般人,拿着手机走在大马路上,还做着题,现实吗?我说你说的很对,但是现在我只做的起Web,我做不起App。那怎么办呢?应该差异化,让手机干手机上应该干的事情,那就是看;让有键盘鼠标可以精确操控的干他们呢应该干的事情,那就是写。很可惜,决定产品的人不是我。微笑

    各位,你们有没有遇到过Modal和后退按钮的烦恼呢?你是怎么处理的呢?

  • 相关阅读:
    资深项目经理推荐的几款免费/开源项目管理工具
    内网穿透工具frp简单使用教程
    10部全尺度欧美宫斗剧!献给不甘平淡的你
    Spring Boot后端+Vue前端+微信小程序,完整的开源解决方案!
    搭建Keepalived + Nginx + Tomcat的高可用负载均衡架构
    集成Activiti工作流的J2EE快速开发框架
    国内5大前端团队网站,你了解多少
    5 天 4000 star 的一个爆款开源项目
    「干货」常用的10个网络DOS命令,菜鸟学了变高手
    js自定义正则表达式
  • 原文地址:https://www.cnblogs.com/lxconan/p/the_modal_dialog_n_backbutton.html
Copyright © 2020-2023  润新知