为什么 "return false" 不起作用？

为什么下面这段代码中的 return false 不起作用？

<script>
  function handler() {
    alert( "..." );
    return false;
  }
</script>

<a href="/?originalUrl=https%3A%2F%2Fzh.javascript.info%2F%26quot%3Bhttps%3A%2F%2Fw3.org%26quot%3B%2520onclick%3D%26quot%3Bhandler()%26quot%3B%26gt%3Bthe%2520browser%2520will%2520go%2520to%2520w3.org%26lt%3B%2Fa%26gt%3B%253C%2Fcode">

浏览器在点击时会根据 URL 进行跳转，但这不是我们想要的。


如何修复它？

当浏览器读取诸如 onclick 之类的 on* 特性（attribute）时，浏览器会根据其内容创建对应的处理程序。
对于 onclick="handler()" 来说，函数是：

      
        
        
          function(event) {
  handler() // onclick 的内容
}
        
      
      
      
现在我们可以看到 handler() 的返回值并没有被使用，也没有对结果产生影响。
修复起来很简单：

      
        
        
          
            
          
          
            
          
        
        
          <script>
  function handler() {
    alert("...");
    return false;
  }
</script>

<a href="/?originalUrl=https%3A%2F%2Fzh.javascript.info%2F%26quot%3Bhttps%3A%2F%2Fw3.org%26quot%3B%2520onclick%3D%26quot%3Breturn%2520handler()%26quot%3B%26gt%3Bw3.org%26lt%3B%2Fa%26gt%3B%253C%2Fcode">

        

      

      
      
我们也可以使用 event.preventDefault()，像这样：


      
        
        
          
            
          
          
            
          
        
        
          <script>
  function handler(event) {
    alert("...");
    event.preventDefault();
  }
</script>

<a href="/?originalUrl=https%3A%2F%2Fzh.javascript.info%2F%26quot%3Bhttps%3A%2F%2Fw3.org%26quot%3B%2520onclick%3D%26quot%3Bhandler(event)%26quot%3B%26gt%3Bw3.org%26lt%3B%2Fa%26gt%3B%253C%2Fcode">