2

单击 a href 链接时，a href 链接在手风琴内不起作用。似乎手风琴的JS功能覆盖了a href链接。现在点击链接，不是打开另一个页面，而是进出扩展（这是JS的功能），这是JS的原始功能。我想要做的是保持手风琴功能，并使 a href 链接工作。这是示例代码：http: //jsfiddle.net/mrPWa/

    <script type="text/javascript"     src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
 <script type="text/javascript">


$(function() { 
height = $(window).height();
 $('.Accord').css({height: height});

    $('.Accord').toggle(function() {
   $('.Accord').animate({width: "20%"}, 500 );
      $(this).removeClass('deSelect');
         $(this).animate({ width: "40%"}, {duration: 500, queue: false});
            $('.deSelect').animate({width: "15%"}, {duration: 500, queue: false});
               $(this).addClass('deSelect');

  }, function() {   
       $('.deSelect').animate({width: "20%"}, 500);



  });
 });

a href 链接在这里。

   <body>

      <div id="Sponsorships_index">

<div id="accordionWrapper">

    <ol>
        <li id="snow" class="Accord deSelect">
        <a href="http://www.apple.com/"> 
        <h1>Apple link is not working!!!!!</h1></a>

        </li>

        <li id="street" class="Accord deSelect">
              <a href="http://www.apple.com/"> 
        <h1>Apple link is not working!!!!!</h1></a>
        </li>

        <li id="water" class="Accord deSelect">

        </li>

        <li id="dirt" class="Accord deSelect">

        </li>

        <li id="sound" class="Accord deSelect">

        </li>
    </ol>
</div>​

  </div>
    </body>
4

1 回答 1

3

将此添加到切换功能的末尾

.on('click', 'a', function(e) { e.stopPropagation(); })

以防止事件冒泡。

所以你最终得到

$('.Accord').toggle(function() {
    $('.Accord').animate({ width: "20%" }, 500)
    $(this).removeClass('deSelect')
    $(this).animate({ width: "40%" }, { duration: 500, queue: false })
    $('.deSelect').animate({ width: "15%" }, { duration: 500, queue: false })
    $(this).addClass('deSelect')
}, function () {
    $('a').click(function(e) { e.stopPropagation(); })
    $('.deSelect').animate({ width: "20%" }, 500)
}).on('click', 'a', function(e) { e.stopPropagation(); })

在这里测试它：http: //jsfiddle.net/RASG/sSG2f/

于 2012-10-17T16:33:46.840 回答