摘要:肯定有这样子的需求:我们希望能用快捷键代替鼠标点击做一些事情,例如一个典型的应用就是论坛上常用的Ctrl + Enter 快捷发帖子。就以Ctrl+Enter快捷发帖子为例,实质上呢,就是通过js脚本,捕获系统的onkeyup事件,判断event.ctrlKey是否为true并且event.keyCode为13,如果满足这个条件,那么就调用按钮对象的click()方法,等同于用鼠标去点击按钮。写个简单的示例代码: <html>
<head>
<title> 快捷键提交示例代码 </title>
<link rel="stylesheet" href='css/style.css' type="text/css">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="author" content="宝玉" />
<script language="JavaScript" type="text/javascript">
<!--
// 快捷键响应
// targetObj: 目标对象,如果满足快捷键条件,触发目标对象的click事件
// ctrlKey: 是否按住了Ctrl组合键
// shiftKey: 是否按住了Shift组合键
// altKey: 是否按住了Alt组合键
// keycode: 按键对应的数值
function Hotkey(event, targetObj, ctrlKey, shiftKey, altKey, keycode)
{
if (
targetObj
&& event.ctrlKey == ctrlKey
&& event.shiftKey == shiftKey
&& event.altKey == altKey
&& event.keyCode == keycode
)
targetObj.click();
}
function fnKeyup(event)
{
var b = document.getElementById("myButton");
Hotkey(event, b, true, false, false, 13);
}
// 捕获系统的Keyup事件
// 如果是Mozilla系列浏览器
if (document.addEventListener)
document.addEventListener("keyup",fnKeyup,true);
else
document.attachEvent("onkeyup",fnKeyup);
//-->
</script>
</head>
<body>
<form method="get" action="no.aspx">
<input type="submit" id="myButton"/>
Ctrl + Enter
</form>
</body>
</html>
上面的脚本可以方便的给指定的按钮加上快捷键。如果现在我们希望应用到我们的服务器端控件当中去,例如Button、Linkbutton、Hyperlink等,因为控件的ID各不相同,而且所对应的快捷键也各不相同,那么我们就需要写一个控件来给他们添加快捷键了。
想想这个控件需要哪些属性?TargetControlID:string:既然是给其他控件绑定的,那么所要绑定的目标控件ID是少不了了,根据这个控件ID,我们才能确定一个控件,才能知道它输出时的客户端ID,才能根据客户端ID来在脚本里面确定这个对象。CtrlKey:bool:判断是否用到Ctrl组合键ShiftKey:bool:判断是否用到Shift组合键AltKey:bool:判断是否用到Alt组合键KeyCode:int:和DHTML里面的event.keyCode对应的,例如Enter的keyCode是13。(注:其实这个不是很友好,因为用的时候还要找一下键盘各个按键和keyCode的对应关系,如果结合一个快捷键设置的控件就比较完美了)Text:string:可能顺便需要一点文字说明什么的
相对来说,这是一个比较简单的用户自定义控件应用,创建一个名字为HotKey的类,继承自System.Web.UI.Controls。根据目标控件ID查找控件对象:this.cachedTargetControl = this.NamingContainer.FindControl(this.TargetControlID);根据上面属性,我们就可以生成相应的客户端脚本了,然后在重写控件的OnPreRender事件中使用RegisterClientScriptBlock方法输出脚本。
代码相对比较简单:using System;
using System.ComponentModel;
using System.Text;
using System.Web;
using System.Web.UI;
using System.Web.UI.Design;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
namespace CommunityServer.Controls
{
/// <summary>
/// hotkey
/// author: dotey
/// http://www.communityserver.cn
/// </summary>
public class Hotkey : Control
{
private static readonly String scriptKey......[
阅读全文]