無法理解jQuery動畫中的「跳躍」

Question

在這個小提琴http://jsfiddle.net/Mrbaseball34/btwa7/中，我無法理解爲什麼「關閉」動畫跳轉。使用完全相同的代碼將其切換爲打開狀態。

function showInfo() { 
    var data_row = $(this).parent().parent();     
    var tr = data_row.next("tr"); 
    var eventcode = ""; 
    var $color = '#000'; 
    $(this).text('Details'); 
    var eventcode = data_row.attr('rel'); 
    if(!tr.is(':visible')) { 
     $(this).text('Close'); 
     var d = "<p>Jelly beans brownie wafer pudding topping. Jelly-o dessert lemon drops jelly beans dragée. Cake macaroon caramels pudding brownie sweet. Jelly gummi bears sweet donut tootsie roll. Soufflé dessert applicake fruitcake tart sugar plum. Jujubes candy fruitcake. Jelly beans marzipan tart macaroon icing icing.</p><p>Candy sugar plum topping icing liquorice. Chupa chups donut jelly pastry halvah. Cake biscuit brownie jelly beans icing biscuit topping. Macaroon bonbon chocolate bar cotton candy soufflé. Sweet roll lemon drops dessert gingerbread dessert fruitcake sweet roll carrot cake. Carrot cake sweet muffin jelly.</p><p>Chocolate bar croissant gingerbread. Jelly-o chocolate cake liquorice lemon drops. Cotton candy croissant sweet roll gummi bears applicake soufflé. Liquorice unerdwear.com brownie gummi bears. Dragée lemon drops lollipop sweet roll donut lollipop danish cupcake. Sweet bear claw carrot cake. Lollipop applicake chocolate chocolate bar ice cream. Icing biscuit gummies chocolate cake cookie cheesecake. Cupcake sugar plum brownie marzipan.</p><p>Liquorice cheesecake biscuit bonbon apple pie tart dragée liquorice tart. Dragée dessert candy canes bonbon cheesecake bear claw gingerbread unerdwear.com. Jelly-o chocolate cake dessert chupa chups cookie donut wafer jelly beans. Biscuit tootsie roll cookie gummi bears gingerbread. Liquorice brownie chupa chups dragée. Marshmallow dragée bear claw croissant gummi bears topping apple pie tootsie roll. Gummi bears macaroon jelly powder biscuit cake macaroon cookie.</p>"; 
     // The ajax call goes here to return the details   
     $("#info_"+eventcode).html(d); 
     $color = '#7D0140'; 
    } 
    $("tr[rel='"+eventcode+"'] .showinfo").css('color', $color); 
    $('html, body').animate({ 
     duration: 1500, 
     scrollTop: data_row.offset().top 
    }); 
    tr.toggle("slow");     
} 

任何人都可以看到我失蹤或可能指出不同的方式來做到這一點嗎？

Answer 1

這就是href="#"在您的代碼運行之前生效。要停止它，使用event.preventDefault()：

function showInfo(e) { 
    e.preventDefault(); 
    var data_row = $(this).parent().parent();     
    // etc. 

http://jsfiddle.net/btwa7/6/