js3
接下来讲一些有关js的事件
鼠标事件：
click 单击鼠标左键时发生，如果右键也按下则不会发生。当用户的焦点在按钮上并按了 Enter 键时，同样会触发这个事件
dblclick 双击鼠标左键时发生，如果右键也按下则不会发生
mousedown 单击任意一个鼠标按钮时发生
mouseout 鼠标指针位于某个元素上且将要移出元素的边界时发生
mouseover 鼠标指针移出某个元素到另一个元素上时发生
mouseup 松开任意一个鼠标按钮时发生
mousemove 鼠标在某个元素上时持续发生
mouseenter 鼠标指针移动在某个元素时发生
mouseleave 鼠标指针离开某个元素时发生
mousewheel 鼠标滑轮滚动时发生
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
<button>清理垃圾</button>
</body>
</html>
<script>
var btns=document.getElementsByTagName('button')
/*btns[0].onclick=function(){
alert("恭喜你，清理成功")
}*/
btns[0].onmousedown=function(){
console.log('鼠标按下')
}
btns[0].onmouseup=function(){
console.log('鼠标抬起')
}
btns[0].onmousemove=function(){
console.log('鼠标按下移动')
}
btns[0].onmouseenter=function(){
console.log('鼠标进入')
}
btns[0].onmouseover=function(){
console.log('鼠标进入over')
}
btns[0].onmouseleave=function(){
console.log('鼠标离开')
}
btns[0].onmouseout=function(){
console.log('鼠标离开out')
}
btns[0].onmousewheel=function(){
console.log('鼠标滚轮')
}
btns[0].ondblclick=function(){
console.log('鼠标双击')
}
</script>
表单事件：
OnSubmit事件：表单中的确定按钮被点击时发生的事件。
onblur:在对象失去焦点时发生的事件。
onfoucs：在对象获得焦点时发生的事件。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> #accountSpan{display: none} </style> </head> <body> <form action=""> <label for="account"> <input type="text" id="account" name="account"> </label> <span id="accountSpan">请输入正确手机号</span> <label for="password"> <input type="password" id="password" name="password"> </label> <input type="submit"> </form> </body> </html> <script> var account=document.getElementById('account') var accountSpan=document.getElementById('accountSpan') account.onblur=function () { accountSpan.style.display='inline' } account.onfocus=function () { accountSpan.style.display='none' } </script>
浙公网安备 33010602011771号