// 有时,我们需要通过键盘上的某些键来配合鼠标来触发一些特殊的事件; // 这些键为:Shift/Ctrl/Alt和Meat(Window中是Windows键,苹果机中是Cmd键); // 它们经常被用来修改鼠标事件和行为,所以叫修改键; 修改键属性 属性 说明 shiftKey 判断是否按下了Shift键; ctrlKey 判断是否按下了ctrlKey键; altKey 判断是否按下了alt键; metaKey 判断是否按下了windows键,IE不支持; // 判断按键函数; function getKey(evt){ var e = evt || window.event; var keys = []; if(e.shiftKey) keys.push('shift'); // 判断是否同时按下了shift键; if(e.ctrlKey) keys.push('ctrl'); if(e.altKey) keys.push('alt'); return keys; } document.onclick = function(evt){ alert(getKey(evt)); // 得到一个数组,可能包含shift/ctrl/alt的值; }
三 键盘事件
用户在使用键盘时会触发键盘事件;
"DOM2级事件"最初规定了键盘事件,后来又删除了相应的内容;
最终还是使用最初的键盘事件,不过IE9已经率先支持"DOM3"级键盘事件;
1.键码
// 在发生keydown和keyup事件时,event对象的keyCode属性中会包含一个代码,与键盘上一个特定的键对应; // 对数字字母字符集,keyCode属性的值与ASCII码中对应小写字母或数字的编码相同;字母中大小写不影响; document.onkeydown = function(evt){ alert(evt.keyCode); }
2.字符编码
// Firefox/Chrome/Safari的event对象都支持一个charCode属性; // 这个属性只有在发生keypress事件时才会包含值,而这个值是按下的那个键所代表字符的ASII编码;(也包含除数字和字母以外的按键); // 此时的keyCode通常等于0或者也可能等于所按键的编码; // IE和Opear则是在keyCode中保存字符的ASCII编码; function getCharCode(evt){ var e = evt || window.event; if(typeof e.charCode == 'number'){ return e.charCode; }else{ return e.keyCode; } } document.onkeypress = function(evt){ alert(getCharCode(evt)); } // PS:可以使用String.fromCharCode()将ASCII编码转换成实际的字符;
四 W3C与IE
// 在标准的DOM事件中,event对象包含与创建它的特定事件有关的属性和方法;
// 触发的事件类型不一样,可用的属性和方法也不一样;
W3C中event对象的属性和方法
属性/方法 类型 读/写 说明
bubbles Boolean 只读 表明事件是否冒泡;
cancelable Boolean 只读 表明是否可以取消事件的默认行为;
currentTarget Element 只读 其事件处理程序当前正在处理事件的那个元素;
detail Integer 只读 与事件相关的细节信息;(一般用于滚轮信息的值);
eventPhase Integer 只读 调用事件处理程序的阶段:1表示捕获阶段,2表示处理目标,3表示冒泡阶段;
preventDefault() Function 只读 取消事件的默认行为;如果cancelable的值是true,则可以使用这个方法;
stopPropagation() Function 只读 取消事件的进一步捕获或冒泡;如果bubbles的值为true,则可以使用这个方法;
target Element 只读 事件的目标;
type String 只读 被触发的事件的类型;
view AbstractView 只读 与事件关联的抽象视图;等同于发生事件的window对象;