表单事件
- onfocus
元素获得焦点时触发 - onblur
元素失去焦点时触发 - onchange
表单元素的内容改变时触发 - onsubmit
submit时触发 - onreset
reset时触发
代码:
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>function testFocus(){console.log("获得焦点了")}function testBlur(){console.log("失去焦点了")}function testChange(value){console.log("内容改变为"+value)}function testSubmit(){var flag = confirm("确定提交表单么?")if(!flag){//在这里我们有机会阻止表单的提交//event.preventDefault();//阻止组件的默认行为return false;}return true;}function testReset(){alert("表单要重置了")}</script></head>
<body><form action="my.html" method="get" onsubmit="testSubmit()" onreset="testReset()">用户昵称:<input type="text" name="realName" onfocus="testFocus()" onblur="testBlur()" onchange="testChange(value)"> <br>登录账号:<input type="text" name="loginName"> <br>选择籍贯:<select name="" id="" onchange="testChange(value)"><option >北京</option><option >上海</option><option >广州</option></select><input type="submit" value="注册"><input type="reset" value="清空"></form></body>
</html>