标签:教育 网页 写法 知识点 span bsp input tar prevent
布尔教育PHP培训
官方网址:www.itbool.com
学习论坛:www.zixue.it
一位学员碰到这样的问题: 他在form表单上绑定onsubmit事件,并在对应的事件函数中return false; 以阻止表单的提交.
0级DOM绑定方式,可以阻止, 但2级DOM绑定方式不能阻止.
0级DOM代码如下, 可以阻止.
<form> <p><input type="submit" value="提交"></p> </form> <script> var fm=document.getElementsByTagName(‘form‘)[0]; fm.onsubmit=function(){ return false; } </script>
2级DOM代码如下, 不能阻止.
<form> <p><input type="submit" value="提交"></p> </form> <script> var fm=document.getElementsByTagName(‘form‘)[0]; fm.addEventListener(‘submit‘,test); function test (){ return false; } </script>
疑问: 绑定的事件函数,同样是return false,为何后者不能阻止.
这是因为在2级绑定方式中,如果需要阻止事件的传播/冒泡,需要用到事件对象对象的stopPropagation()方法.
阻止事件的默认行为,要用事件对象的preventDefault()方法.
正确的写法如下:
<form> <p><input type="submit" value="提交"></p> </form> <script> var fm=document.getElementsByTagName(‘form‘)[0]; fm.addEventListener(‘submit‘,test); function test (e){ e.preventDefault(); } </script>
这个问题很高深吗? 一点都不, 其实是因为该学员追求技巧而不注重基础引起的.
就如倚天屠龙记中的周芷若,内力不足,强练九阴真经,终致走火入魔.
如果认真学习过十八哥的”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.
标签:教育 网页 写法 知识点 span bsp input tar prevent
原文地址:http://www.cnblogs.com/booljiaoyu/p/6094705.html