首页 > 代码库 > DOM事件类型总结大全
DOM事件类型总结大全
unload:事件在用户退出页面时发生
window.onload = function(){
return "页面关闭!";
};
onblur:失去焦点发生变化
window.onblur = function(){
inp.value = http://www.mamicode.com/inp.value.toUppercase();
};
onfocus:点击文本框会获得焦点发生
inp.focus = function(){
alert(‘弹出的内容‘);
};
onselect:要选中文本框中的内容会执行的事件
inp.onselect = function(){
alert(‘要执行的内容‘);
};
onchange:事件会在域的内容发生改变时发生
inp.onchange = function(){
alert(‘要执行的内容‘);
};
onreset:当点击重置的时候才会发生
form.onreset = function(){
//点击重置,是form;
};
onsumbit:点击提交
form.onsumbit = function(){
alert(‘要执行的内容‘);
};
onresize:当窗口发生大小变换的时候就会执行
window.onresize = function(){
alert(‘要执行的内容‘);
};
scrollBy、scrollTo:相对于自己之前的位置发生偏移,一个x一个y轴为参数
function scroll(){
window.scrollBy(100,100);
window.scrollTo(100,100);//绝对,固定
};
ondbclick:双击发生变化
inp.ondbclick = function(){
inp.value = "http://www.mamicode.com/我双击了";
};
onclick:点击发生变化
inp.onclick = function(){
inp.value = "http://www.mamicode.com/我点击了";
};
onmouseover:鼠标经过会发生变化,类似hover效果
inp.onmouseover = function(){
inp.value = "http://www.mamicode.com/我鼠标滑过了";
};
onmouseout:鼠标移除会发生变化
inp.onmouseout = function(){
inp.value = "http://www.mamicode.com/我鼠标移除来了了";
};
onmousedown:鼠标按键按下去会发生变化
inp.onmousedown = function(){
inp.value = "http://www.mamicode.com/我鼠标按下来了";
};
onmouseup:按键按下去并释放松开会发生变化
inp.onmouseup = function(){
inp.value = "http://www.mamicode.com/我鼠标按下并释放了";
};
onkeydown:按下键盘去会发生变化
inp.onkeydown = function(){
inp.value = "http://www.mamicode.com/我按下键盘了";
};
onkeyup:按下键盘去会发生变化
inp.onkeyup = function(){
inp.value = "http://www.mamicode.com/我松开键盘了";
};
DOM事件类型总结大全