javascript - event.preventDefault() 不会避免打开链接

Question

我有以下代码，但尽管使用了 event.preventDefault()，但单击链接仍然会导致打开该目标 div!我已经在 stackoverflow 中阅读了有关此问题的所有问题，但它们都没有解决我的问题。警报部分已完成，但 event.preventDefault() 不起作用!请帮助我!

html 是:

<ul class="projects-info">
   <li><a href="#tabs-1">file upload</a></li>                                                                       
   <li class="projects-det"><a href="#tabs-2">file specification</a></li>
</ul>
<div style="border:1px solid  #1c94c4;" id="tabs-2">
   this is the div content
</div>

jQuery 是:

<script type="text/javascript" src="Scripts/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
   $(document).ready(function ()
   {
      $("ul.projects-info li.projects-det a").bind('click',function(event)
      {
         event = event || window.event;
     alert("for checking");
         if(event.preventDefault)
         {
            event.preventDefault(); 
         }
         if (event.stopPropagation) 
         {
            event.stopPropagation();
         }
         return false;
   });
});

Answer 1

看起来您正在使用其他库来支持选项卡式界面。

如果链接是指向另一个页面的常规超链接，则 preventDefault 会阻止这种情况发生。

但是，如果有两个处理程序绑定(bind)到同一个事件(在您的情况下为“点击”)，那么每个处理程序都将彼此独立工作。你无法控制秩序，他们也无法相互压制。

因此，绑定(bind)执行 Tab 键的处理程序仍会被激活。

这是一个 fiddle :http://jsfiddle.net/4J9Ap/

两个处理程序绑定(bind)到同一个链接 - 都触发。

$(document).ready(function ()
   {
      $("ul.projects-info li.projects-det a").bind('click',function(event)
      {
         event = event || window.event;
         if(event.preventDefault)
         {
            event.preventDefault(); 
         }
         if (event.stopPropagation) 
         {
            event.stopPropagation();
         }
         alert("handler 1")
         return false;
      });

     $("a#myLink").bind('click',function(event)
      {
         event = event || window.event;
         if(event.preventDefault)
         {
            event.preventDefault(); 
         }
         if (event.stopPropagation) 
         {
            event.stopPropagation();
         }
          alert("handler 2")
         return false;
      });
});