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会停止发生这种情况。

但是，如果有两个处理程序绑定到同一个事件（在您的情况下为“click”），则每个处理程序彼此独立地工作。你无法控制秩序，也不能相互压制。

因此，必须激活必须执行Tab键的处理程序。

这是一个小提琴：http://jsfiddle.net/4J9Ap/

两个处理程序绑定到同一个链接 - 同时触发。

$(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;
      });
});

event.preventDefault（）不会避免打开链接

1 个答案: