防止Web应用程序中页面之间的击键丢失

时间:2020-03-05 18:53:05  来源:igfitidea点击:

我当前的项目是编写一个与现有桌面应用程序等效的Web应用程序。

在桌面应用程序中,工作流中的某些点,用户可能会单击一个按钮,然后显示要填写的表单。即使该应用程序花费一点时间来显示该表单,专家用户也知道该表单将是并且会在知道应用程序会"跟上他们"的情况下开始输入。

在Web应用程序中,这不会发生:当用户单击链接时,他们的击键将丢失,直到取消了下一页上的表单。有没有人有办法防止这种情况发生?我是否必须放弃使用单独的页面,而使用AJAX通过GWT之类的东西将表单嵌入页面中,还是会丢失键击问题?

解决方案

回答

AJAX或者插件是我们唯一的机会。

回答

直到页面加载,JavaScript已处理且文本字段为焦点后,按键才会生效。

基本上,我们真正要问的是;如何加快Web应用程序的速度以增加响应时间?你的答案是AJAX!

请仔细考虑应用程序中最常见的操作,并使用AJAX来最大程度地减少网页的重新加载。记住,不要过度使用AJAX。使用过多的javascript会像改善它一样会阻碍可用性。

相关阅读材料:

  • 响应时间:三个重要限制-可用性之王Jacon Neilson的精彩文章。
  • Ajax可用性错误
  • AJAX可用性清单

回答

我认为很难做自己想做的事。我认为真正的问题是新页面的加载时间太长。我们应该查看缓存页面或者对图片等静态组件进行部分缓存,以缩短加载时间或者预加载页面并使页面不可见。 (有关更多想法,请参见简单技巧以获取更多可用的表格)

对于编码选项,我们可以使用javascript捕获击键(请参阅检测各种击键)

<html><head>
<script language=javascript>
IE=document.all;
NN=document.layers;
kys="";
if (NN){document.captureEvents(Event.KEYPRESS)}
document.onkeypress=katch
function katch(e){
if (NN){kys+=e.which}
if (IE){kys+=event.keyCode}
document.forms[0].elements[0].value=kys
}
</script>
</head>
<body>
<form><input></form>
</body>
</html>

在控制权从当前页面传递之后,我们将需要保存然后将它们转移到新页面。 (请参阅关闭浏览器或者退出页面时保存更改)

有关在各种浏览器中检测击键问题的一些常规信息,请查看Javascript检测击键。

回答

也许我在想问题,但我将其丢掉了……我们可以将表单放在click事件中显示的隐藏div或者类似容器中(也许给它模态外观/行为?)的链接。这样,表单已经作为页面的一部分被加载。它应该几乎立即出现。

我们可以在各处找到模态div教程,不要太棘手。如果我们使用的是ASP.NET,则Microsoft的AJAX库中甚至还包含一个。