随着越来越多的应用程序从桌面迁移到Web平台,终端用户期望Web应用能够提供与他们之前在桌面应用中相同的外观和感觉。这包括桌面应用提供的快捷键组合,如“保存”、“编辑”等,用于执行一些快速任务。虽然在Web应用中实现这些功能有些棘手,但通过JavaScript可以完成这一任务。
实现此功能的第一步是捕获用户在使用Web页面时按下某个键的键盘事件。以下是实现此功能的方法:
<script type="text/javascript">
document.onkeyup = KeyCheck;
function KeyCheck(e) {
var KeyID = (window.event) ? event.keyCode : e.keyCode;
alert("KeyId=" + KeyID);
}
</script>
KeyID将为提供一个数字,指示按下了哪个键。可以根据KeyID的值构建逻辑。还可以使用诸如“Ctrl+S”之类的键组合。
以下是经过编写和测试的代码,用于处理各种按键事件的回传。首先,将此JavaScript添加到页面中:
<script type="text/javascript">
document.onkeyup = KeyCheck;
function KeyCheck(e) {
var KeyID = (window.event) ? event.keyCode : e.keyCode;
switch (KeyID) {
case 113:
__doPostBack('__Page', 'F2');
break;
case 118:
__doPostBack('__Page', 'F7');
break;
case 119:
__doPostBack('__Page', 'F8');
break;
case 120:
__doPostBack('__Page', 'F9');
break;
case 121:
__doPostBack('__Page', 'F10');
break;
case 122:
__doPostBack('__Page', 'F11');
break;
case 123:
__doPostBack('__Page', 'F12');
break;
case 16:
__doPostBack('__Page', 'Shift');
break;
case 17:
__doPostBack('__Page', 'Ctrl');
break;
case 18:
__doPostBack('__Page', 'Alt');
break;
case 19:
__doPostBack('__Page', 'Pause');
break;
case 37:
__doPostBack('__Page', 'ArrowLeft');
break;
case 38:
__doPostBack('__Page', 'ArrowUp');
break;
case 39:
__doPostBack('__Page', 'ArrowRight');
break;
case 40:
__doPostBack('__Page', 'ArrowDown');
break;
}
}
</script>
此脚本执行回传操作,并将按下的键的名称作为“Request["__EVENTARGUMENT"]”键在请求对象中的值传递。
为了使“__doPostBack”工作,需要在页面加载时注册回传事件引用。以下代码解释了如何完成此操作:
protected void Page_Load(object sender, EventArgs e) {
Page.ClientScript.GetPostBackEventReference(this, "");
string eventArgs = Request["__EVENTARGUMENT"];
if (!string.IsNullOrEmpty(eventArgs)) {
switch (eventArgs) {
case "F7":
DoF7();
break;
case "F8":
DoF8();
break;
case "F9":
DoF9();
break;
case "F10":
DoF10();
break;
}
}
}