JQuery切换链接

时间:2014-02-24 17:01:53

标签: jquery html css

当使用jQuery“pulsate”效果时,目标div中有一个链接,该链接无法操作。如何防止滑块效果运行,而是可以单击链接,然后加载“pulsate”div内的目标?

这是一个代码示例:

$(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 个答案:

答案 0 :(得分: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(); 
});