首页 > 代码库 > JS-DOM：Event 对象
JS-DOM：Event 对象
事件（event）由事件及事件方法组成：
（事件对象的兼容写法：window.event||event）
1、鼠标事件：
mousedown、mousemove、mouseup、ondbclick、contextmenu...
2、表单事件：
focus、blur、submit、change...
3、键盘事件
keydown、keyup、keypress...
4、阻止冒泡
oEvent.cancelBubble=true;
5、阻止默认事件
return false;
6、键盘方法
keyCode
1、onblur ：失去焦点
<script>
window.onload=function(){
var oTxt=document.getElementById("txt1");
oTxt.onblur=function(){
alert("失去焦点");
}
}
</script>
2、oncontextmenu：用oncontextmenu事件单禁用右键菜单
<script>
document.oncontextmenu=function(){
alert(‘a‘);
}
</script>
3 、ondblclick: 鼠标双击事件
<srcipt>
window.ondblclick=function(){
alert(‘a‘);
}
</script>
4、onfocus: onFocus事件就是当光标落在文本框中时发生的事件
<script>
window.onload=function(){
var oTxt=document.getElementById("txt1");
oTxt.onfocus=function(){
alert("聚焦了");
}
}
</script>
<body>
<input type="text" id="txt1" value="http://www.mamicode.com/请输入文本">
</body>
5、onmousedown : 鼠标按钮被按下 ... onm ouse up : 鼠标按键被松开
<style type="text/css">
#div1{
height: 100px;
width: 100px;
background-color: #ccc;
}
</style>
<script type="text/javascript">
window.onload=function (){
document.onmousedown=function(){
alert(‘a‘);
}
}
</script>
<script type="text/javascript">
window.onload=function (){
document.onmouseup=function(){
alert(‘a‘);
}
}
</script>
<body>
<div id="div1"></div>
</body>
6、onmousemove ：鼠标被移动
<style type="text/css">
#div1{
height: 100px;
width: 100px;
background-color: #ccc;
}
</style>
<script type="text/javascript">
window.onload=function(){
var oDiv=document.getElementById("div1");
document.onmousemove=function(ev){
var oEvent=ev||window.event;
document.title=oEvent.clientX;
oDiv.style.left=oEvent.clientX+"px";
oDiv.style.top=oEvent.clientY+"px";
}
}
</script>
<body>
<div id="div1"></div>
</body>
未完待续。。。