DOM事件绑定与行为阻止

布尔教育PHP培训

官方网址:www.itbool.com

学习论坛:www.zixue.it

一位学员碰到这样的问题: 他在form表单上绑定onsubmit事件,并在对应的事件函数中return false; 以阻止表单的提交.

0级DOM绑定方式,可以阻止, 但2级DOM绑定方式不能阻止.

0级DOM代码如下, 可以阻止

2级DOM代码如下, 不能阻止.

疑问: 绑定的事件函数,同样是return false,为何后者不能阻止.

这是因为在2级绑定方式中,如果需要阻止事件的传播/冒泡,需要用到事件对象对象的stopPropagation()方法.

阻止事件的默认行为,要用事件对象的preventDefault()方法.

正确的写法如下:

这个问题很高深吗? 一点都不, 其实是因为该学员追求技巧而不注重基础引起的.

就如倚天屠龙记中的周芷若,内力不足,强练九阴真经,终致走火入魔.

如果认真学习过十八哥的”JS高级”中的事件停止传播与效果阻止

就不会有此疑问.

所以此处提醒同学们: 学习,要尽量系统性的学.争取学一门,得到一门.

而不要搜索几个新鲜知识点,试来试去,看似了解很多,实则一片茫然.

如果你仍要刨根问底,为什么2级标准中,绑定的事件,return false不能阻止事件发生呢?

答:w3c中规定,addEventListener()的第2个参数中绑定的事件对象”无返回值”,自然return false也不灵了.

官方说明:O网页链接

细看这一句:

This is an ECMAScript function reference. This method has no return value. The parameter is a Event object.