设计网站时打开新标签与弹出窗口一样糟糕

时间:2018-02-02 10:23:24

标签: html user-interface mobile

我的网络应用程序正在模仿桌面应用程序的UI,流程如下

  1. 在浏览器窗口中选择任务
  2. enter image description here

    1. 更改任何选项,然后启动
    2. enter image description here

      1. 在同一浏览器窗口中显示进度,进度条goh每隔5秒返回服务器检查进度。
      2. enter image description here

        1. 任务完成后,我们会在新标签中显示报告
        2. enter image description here

          然后返回选择任务窗口,

          enter image description here

          这是通过运行以下Javascript进行中页面

          来完成的

          window.open(' /启动'' _self&#39); window.open(' / reporturl'' _blank&#39);

          这在我的电脑上工作正常,但在OSX和Android手机和iPad上试用Safari时,会发生以下两种情况之一

          1. 进度页面成为开始页面,但报告页面未在标签
          2. 中打开
          3. “进度”页面成为报告页面
          4. 我的问题是在_blank的新标签页中打开窗口是否存在使用弹出窗口的所有问题。如果是这样,我应该修改我的prcoess,以便在第3阶段它只显示报告页面,然后在报告中添加一个后退按钮或可导航的页脚,以允许用户返回起始页面?

1 个答案:

答案 0 :(得分:1)

我可以考虑一些您可以使用的选项而不是新标签。

  • 使用Ajax的模式 - 使用jQuery可以打开modal dialogs,可以使用ajax(异步)获取的html(或其他数据)填充它们。我是这些人的忠实粉丝,并在我的项目中使用它们。用户不会对弹出警告消息等感到烦恼。一旦读取内容(或其他内容),用户就可以简单地关闭对话框。 (如果我必须制作你的应用程序,我肯定会实现这个。)

    除了jQuery对话框之外,还有其他模态/对话框脚本。 Check out Bootstrap Modal如果你喜欢现代的话。{/ p>

  • 将报告下载 - 根据用户可以/将要对报告执行的操作,编写报告页面的方式可能会很有趣,因为它会将.pdf文件或其他类型的文件作为下载文件发回。现在,在新选项卡中加载URL将始终开始下载。在没有用户交互的情况下从JS触发这可能是一个问题(与弹出/新选项卡相同)。添加按钮以在完成时触发下载将解决此问题。

我知道问题是关于标签的使用..但试着避免它。浏览器以自己的方式处理它们。许多用户在他们没有要求时突然在标签中打开东西时会感到困惑。在弹出窗口的情况下,用户可以将其转换或转换为在浏览器设置中打开新选项卡。如果他们一直在摆弄浏览器默认设置,那么对于所有用户(以及跨浏览器)来说,保持应用程序的“流量”都是相同的麻烦。