大众计算机学习网

专门提供各种电脑教程

按钮事件onclick return false的解释

Admin | 2016-3-4 7:24:52 | 被阅次数 | 3474

  有时候我们根据需要会在网页中的按钮事件中加入return false,那么,这个return false到底是什么意思,有使用作业呢?

  return false不是取消事件冒泡,而是取消“浏览器默认行为”。

  比如一个链接:<a href="http://www.xxx.com">文字链接</a>

  当我们点击这个链接时,浏览器会自动跳转到:www.xxx.com这个地址,这是浏览器的默认行为。

  相反,如果我们这么做:<a href="http://www.xxx.com" onclick="return false">文字链接</a>

  那么再次点击这个链接时,浏览器则不会进行跳转。

  具体的应用,我们可以看有功能按钮的部分。

  假设存在如下的表单及按钮及事件:

  <form name="form1"  onsubmit="return Webfunction();">......</form>

  <input type="submit" onclick="Buttonfunction(); return false;" />

  而JS部分如下:

  <script>
  function Webfunction()
  {
   alert("页面事件");
  }

  function Buttonfunction()
  {
   alert("按钮事件");
  }

  </script>

  现在来看结果。

  假设第一种情况:<input type="submit" onclick="Buttonfunction();" /> 注意,此时没有return false;,那么,当点击页面中的按钮时,先是触发弹出“按钮事件”,然后接着弹出“页面事件”的提示,这说明,点击按钮触发按钮事件,之后还会自动触发表单事件。

  假设第二种情况:<input type="submit" onclick="Buttonfunction(); return false;" /> 注意,此时有return false;,当点击按钮后,只会弹出“按钮事件”的提示,而不会弹出“页面事件”的提示,这说明,页面事件被取消了。