在javascript脚本文件中为标签添加事件,将事件与HTML分离
var data= document.getElementById("...");
data.onclick = box;
赋值时,只要加上函数名就可以了,如果加上括号,会自动执行。
鼠标事件
onclick 单击
ondblclick 双击
onmousedown 按下还没有释放
onmouseup 释放鼠标时
onmouseover 鼠标经过区域
onmouseout 鼠标离开时
onmousemove 鼠标移动时执行
键盘事件
onkeydown 按下任意键时触发,按下不放会重复触发
onkeypress 按下字符键时触发
onkeyup 松开任意键时触发
HTML事件
onload 加载完成后执行
onunload 页面卸载的时候执行
onselect 选定文本框中文字并松开鼠标时执行
onchange 当文本框中文字改变,并失去焦点时
onfocus 获得焦点,
onblur 失去焦点时
onsubmit 表单(必须在表单form标签上触发)
onreset 重置按钮
onresize 窗口大小变化时
window.resize = function(){};
onscroll 当滚动条滚动时执行
window.onscroll
事件中的this表示绑定的对象,全局范围就是window
当不传参时,arguments[0] 表示event事件对象,浏览器默认传递一个事件对象
onclick= function(event){
alert(event)// IE中是winodw.event
}
鼠标
onclick只用于左键,onmousedown 和 onmouseup支持所有键
event的button属性
0 左键
1 中键
2 右键
IE:
1 左键
2 右键
4 中键
clientX / clientY
可视区的横纵坐标(不包括被滚动条隐藏的部分)
scrennX / screenY
在屏幕上的坐标
event.screenX
scrollLeft / scrollTop
获取被滚动条隐藏的部分的高度
document.body.scrollTop
shiftKey /ctrlKey / altKey
判断是否按下shift/ctrl/alt键
if(event.shiftKey)
获取键盘返回的值
键码
键盘上的任意键,返回ASCII码,字母不区分大小写(全部转换为大写)
keyCode 返回键码
String.fromCharCode(ASCII码) 将编码转换为字符
document.onkeydown = function(){
alert("键码"+event.keyCode+String.fromCharCode(event.keyCode));
}
字符编码
keypress 事件
charCode 区分大小写返回字符编码
document.onkeydown = function(event){
alert("字符编码:"+event.keyCode+String.fromCharCode(event.charCode));
}
target
onclick事件中,event.target / event.srcElement可以获得与之绑定的标签对象
cancelBubble / setPropagation
取消冒泡