今天下班比较晚，所以更新内容比较少。
一、onsubmit事件
设置在submit之前的一个事件，对文本框输入的内容进行一个预先的审核事件，所增加的函数发生在submit之前
是当表单在提交时触发. 该属性也只能给form元素使用.应用场景: 在表单提交前验证用户输入是否正确.如果验证失败.在该方法中我们应该阻止表单的提交.
比如，如果要求输入的用户名不能有数字，如果有提请“你输入的内容有数字
<form id="form">
<input type="text"/>
<input type="submit" value="点我!" />
</form>
<script type="text/javascript">
//阻止表单提交方式1().
//onsubmit 命名的事件函数,可以接受返回值. 其中返回false表示拦截表单提交.其他为放行.
var ele=document.getElementById("form");
ele.onsubmit=function(event) {
// alert("验证失败 表单不会提交!");
// return false;
// 阻止表单提交方式2 event.preventDefault(); ==>通知浏览器不要执行与事件关联的默认动作。
alert("验证失败 表单不会提交!");
event.preventDefault();
}
关于onsubmit，个人觉得还是比较重要，后期可以作为注册账户时的资格预审，验证内容是否符合要求。
二、Event 对象
Event 对象代表事件的状态，比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。
事件通常与函数结合使用，函数不会在事件发生前被执行！event对象在事件发生时系统已经创建好了,并且会在事件函数被调用时传给事件函数.我们获得仅仅需要接收一下即可。比如onkeydown,我们想知道哪个键被按下了，需要问下event对象的属性，这里就时KeyCode；
这里提到关于淘宝，当你的鼠标悬停在某张图上时，会在右侧显示局部大图，并且会跟随你的鼠标移动而变换，这里就是用到了event对象。
三、组织事件外延
如下会有这样两个嵌套的标签。
<div id="abc_1" style="border:1px solid red;width:300px;height:300px;">
<div id="abc_2" style="border:1px solid red;width:200px;height:200px;">
</div>
如果同时为两个div标签绑定onclick事件，那么在触发abc_2的时候不可避免的会触发到abc_1，这就是所说的事件外延，如何阻止？
通过event：
<div id="abc_1" style="border:1px solid red;width:300px;height:300px;">
<div id="abc_2" style="border:1px solid red;width:200px;height:200px;">
</div>
</div>
<script type="text/javascript">
document.getElementById("abc_1").onclick=function(){
alert(‘111‘);
}
document.getElementById("abc_2").onclick=function(event){
alert(‘222‘);
event.stopPropagation(); //阻止事件向外层div传播.
}
</script>
这里需要注意的点是，如果是在标签内直接绑定函数，是无法进行阻止的，所以今后关于绑定函数，尽量通过节点来查找标签。
由于dom增删改查部分内容较多，今天内容就暂时更新到这里。
Python学习第83天（JavaScript的onsubmit事件和阻止事件外延）
原文：https://www.cnblogs.com/xiaoyaotx/p/12927411.html