2014-02-24 97 views
0

当使用jQuery“pulsate”效果,并且目标div中存在链接时,链接无法运行。我怎样才能防止滑块效果运行,而是可以点击一个链接,并加载目标,即在“pulsate”div内?JQuery Toggle with Link

这里是一个代码示例:

$(document).ready(function() { 
    $(".toggler").click(function (event) { 
     event.preventDefault(); 
     $(this).effect('pulsate',{times:2},function(){ 
      $(this).fadeOut('slow'); 
     }); 
    }); 
}); 


<div class="aeast toggler"> 
    <table class="" width="100%"> 
      <tr> 
      <th><img src="http://content.sportslogos.net/logos/7/151/thumbs/y71myf8mlwlk8lbgagh3fd5e0.gif" alt="Patriots"></th> 
      <th><img src="http://content.sportslogos.net/logos/7/152/thumbs/v7tehkwthrwefgounvi7znf5k.gif" alt="Jets"></th> 
      <th><img src="http://content.sportslogos.net/logos/7/150/thumbs/15041052013.gif" alt="Dolphins"></th> 
      <th><img src="http://content.sportslogos.net/logos/7/149/thumbs/n0fd1z6xmhigb0eej3323ebwq.gif" alt="Bills"></th> 
      </tr> 
      <tr> 
      <td class="name">New England Patriots</td> 
      <td>asdad</td> 
      <td>dasd</td> 
      <td>asd</td>        
      </tr> 
      <tr> 
      <td><a href="http://www.google.com" target="_blank">Main Website</a></td> 
      <td>asda</td> 
      <td>asda</td> 
      <td>asda</td>        
      </tr>      
    </table>      
</div> 

http://jsfiddle.net/zuE65/

回答

1

你防止你的点击处理程序的默认操作。你能避免这样做的链接:

http://jsfiddle.net/7xb2V/

if (event.target.tagName.toLower() == 'a') return; 

或者

if ($(event.target).is('a')) return; 

你可能还结合第二种处理程序的astopPropagation

http://jsfiddle.net/25sQs/

$('.toggler a').click(function(e) { 
    e.stopPropagation(); 
}); 
+0

谢谢你,我知道它与一个功能有关。我只是不知道如何去构建JavaScript中的代码。 – TrippedStackers