键盘事件及阻止默认事件

1.键盘事件

/*
 键盘事件
 onkeydown:当键盘按键按下的时候触发
 onkeyup：当键盘按键抬起的时候触发
 
 event.keyCode:数字类型  键盘按键的值 键值
 		ctrlKey,shiftKey,altKey 布尔值
 		当一个事件发生的时候，如果ctrl或者shift或者alt是按下的状态，返回true，否则返回false；
 	
 注意：不是所有元素都能够接收键盘事件，能够响应用户输入的元素，能够接收焦点的元素就能够接收键盘事件
 

 * */
//document.οnkeydοwn=function(ev){
//	var ev=ev||event;
	alert(ev.keyCode);
//}

document.οnclick=function(ev){
	var ev=ev||event;
	//点击doucument的时候，当ctrl键按下时弹出true，抬起时弹出false
	alert(ev.ctrlKey);
}

按键控制div移动（及解决卡顿问题）

var oDiv=document.getElementById("div1");

//创建各个方向条件判断初始变量
var Left=false;
var Right=false;
var Top=false;
var Bottom=false;

//当按键按下时，对应方向的按键条件变为true
document.οnkeydοwn=function(ev){
	var ev=ev||event;
	switch (ev.keyCode){
		case 38:
			Top=true;
			break;
		case 40:
			Bottom=true;
			break;
		case 37:
			Left=true;
			break;
		case 39:
			Right=true;
			break;
	}
}
//当按键抬起时，对应方向的按键条件变为false
document.οnkeyup=function(ev){
	var ev=ev||event;
	switch (ev.keyCode){
		case 38:
			Top=false;
			break;
		case 40:
			Bottom=false;
			break;
		case 37:
			Left=false;
			break;
		case 39:
			Right=false;
			break;
	}
}

setInterval(function(){
	//当其中的一个条件为true时，则执行当前函数
	if(Right){
		oDiv.style.left=oDiv.offsetLeft+10+'px';
	}else if(Left){
		oDiv.style.left=oDiv.offsetLeft-10+'px';
	}else if(Top){
		oDiv.style.top=oDiv.offsetTop-10+'px';
	}else if(Bottom){
		oDiv.style.top=oDiv.offsetTop+10+'px';
	}
},50)

2.取消默认事件　

自定义右键菜单

/*
阻止默认事件
分析当前这个行为是什么事件触发的,然后在这个事件的处理函数中使用return false;就可以阻止默认事件
oncontextmenu:右键菜单事件，当右键菜单（环境菜单）显示出来的时候触发

 * */
//自定义右键菜单

var oDiv=document.getElementById("div1");

//点击右键菜单显示
document.οncοntextmenu=function(ev){
	var ev=ev||event;
	
	//鼠标值
	var Left=ev.clientX;
	var Top=ev.clientY;
	
	//菜单根据鼠标的位置定位
	oDiv.style.left=Left+'px';
	oDiv.style.top=Top+'px';
	
	oDiv.style.display="block";
	
	
	
	//阻止默认事件
	return false;
}
//点击document菜单消失
document.οnclick=function(){
	oDiv.style.display="none";
}

　　

　　

　　

转载于:https://www.cnblogs.com/yangxue72/p/8135698.html