<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>事件演示</title>
</head>
<!--
onblur元素失去焦点
onfocus元素获得焦点
onload某个页面或图像被完成加载
onsubmit当表单提交时触发该事件
onmouseover鼠标被移到某元素之上
onmouseout鼠标从某元素移开
-->
<body>
<form id="userForm" action="https://www.baidu.com" >
<!-- onblur元素失去焦点 -->
<input id="username" onblur="onBlur(this)" type="text" >
<input type="submit" value="输入框提交">
<button onsubmit="userFormSubmit()" >按钮提交</button>
</form>
<script>
function userFormSubmit (){
console.log("提交")
return false;
}
let userForm = document.getElementById("userForm");
userForm.onsubmit = userFormSubmit;
//页面加载完成之后执行
window.onload = function (){
let ins = document.getElementById("username");
ins.onfocus = function (){
console.log("获取焦点")
}
}
function onBlur(t){
//this
console.log(t)
}
</script>
</body>
</html>