JavaScript 事件

鼠标事件

鼠标单击事件 onclick

document.addEventListener('click', function () {
    console.log(1);
});

鼠标双击事件 ondblclick

document.addEventListener('ondblclick', function () {
    console.log(1);
});

鼠标按下事件 onmousedown

document.addEventListener('onmousedown', function () {
    console.log(1);
});

鼠标按下松开事件 onmouseup

document.addEventListener('onmouseup', function () {
    console.log(1);
});

鼠标移入事件 onmouseenter

document.addEventListener('onmouseenter', function () {
    console.log(1);
});

鼠标移出事件 onmouseleave

document.addEventListener('onmouseleave', function () {
    console.log(1);
});

鼠标移动事件 onmousemove

document.addEventListener('onmousemove', function () {
    console.log(1);
});

鼠标触碰子元素/离开子元素/离开元素事件 onmouseout

document.addEventListener('onmouseout', function () {
    console.log(1);
});

鼠标触碰子元素/离开子元素/触碰元素事件 onmouseover

document.addEventListener('onmouseover', function () {
    console.log(1);
});

鼠标滚轮事件 onmousewheel

document.addEventListener('onmousewheel', function () {
    console.log(1);
});

文档事件

加载事件 onload

window.onload = function () {
    console.log(1);
};

卸载事件 onunload

window.onunload = function () {
    console.log(1);
};

窗口尺寸更改事件 onresize

window.onresize = function () {
    console.log(1);
};

表单事件

获取焦点事件 onfocus

<input type="text" onfocus="fn()" />

失去焦点事件 onblur

<input type="text" onblur="fn()" />

改变事件 onchange

<input type="text" onchange="fn()" />

内容选中事件 onselect

<input type="text" onselect="fn()" />

表单提交事件 onsubmit

<form onsubmit="fn()">
    <input type="submit" value="Submit" />
</form>

function fn() {
    alert(1);
}