js事件监听机制（⼀）概念：
某些组件被执⾏了某些操作后，触发某些代码的执⾏。
事件：某些操作。如： 单击，双击，键盘按下了，⿏标移动了
事件源：组件。如： 按钮 ⽂本输⼊框...
：代码。
注册监听：将事件，事件源，结合在⼀起。 当事件源上发⽣了某个事件，则触发执⾏某个代码。常见的事件：
1、点击事件：
onclick：单击事件
ondblclick：双击事件
2、焦点事件
onblur：失去焦点
onfocus：元素获得焦点。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>常见事件</title>
<script>
//2.加载完成事件  onload
//1.失去焦点事件onblur
alert("失去焦点了...");
}
</script>
</head>
<body>
<!--表单提交-->
<input name="username" id="username">
</body>
</html>
3、加载事件：
onload：⼀张页⾯或⼀幅图像完成加载。
4、⿏标事件：
onmousedown ⿏标按钮被按下。
onmouseup ⿏标按键被松开。
onmousemove ⿏标被移动。
blur事件
onmouseover ⿏标移到某元素之上。
onmouseout ⿏标从某元素移开。
//3.绑定⿏标移动到元素之上事件
alert("⿏标来了....");
}
//3.绑定⿏标点击事件,onmousedown ⿏标按钮被按下
// alert("⿏标点击了....");
alert(event.button); // 0左键 1中键 2右键
}
// 按下enter 提交表单
if(event.keyCode == 13){
alert("提交表单");
}
}
5、键盘事件：
onkeydown 某个键盘按键被按下。
onkeyup 某个键盘按键被松开。
onkeypress 某个键盘按键被按下并松开。
6、选择和改变
onchange 域的内容被改变。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>常见事件</title>
<script>
/
/省市区的三级联动
}
</script>
</head>
<body>
<form action="#" id="form"  >
<select id="city">
<option>--请选择--</option>
<option>北京</option>
<option>上海</option>
<option>西安</option>
</select>
<input type="submit" value="提交">
</form>
</body>
</html>
onselect ⽂本被选中。
7、表单事件：
onsubmit 确认按钮被点击。
onreset 重置按钮被点击。
校验符合条件的才可提交数据
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>常见事件</title>
<script>
function checkForm(){
//如果是false不允许提交数据
return true;
}
</script>
</head>
<body>
<!--表单提交-->
<form action="#" id="form" onclick="return  checkForm();" > <input name="username" id="username">
<select id="city" name="city">
<option>--请选择--</option>
<option>北京</option>
<option>上海</option>
<option>西安</option>
</select>
<input type="submit" value="提交">
</form>
</body>
</html>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。