2015-10-06 57 views
1

在理想的世界中,我不想爲此使用表格,但對於如此強大的數據表格的佈局來說,它是理想的選擇。無論如何,當用戶點擊某個部分的標題時,我想讓windwo保留在該部分的頂部,而不是在現在打開的部分的底部。 JavaScript的我在那裏有目前:jQuery保留在打開的可摺疊表格頂部點擊時

$(document).ready(function() { 
 
    $('tr.parent').next('tr.child').hide(); 
 
    $('a.toggle').on('click', function (e) { 
 
     e.preventDefault(); 
 
     var $this = $(this), 
 
      $child = $this.closest('tr.parent').next('tr.child'); 
 
     $this.closest('tr.parent').siblings('tr.child').not($child).hide(); 
 
     $child.toggle(); 
 
    }) 
 
});

我已經創建了一個Fiddle Here所以你可以看到HTML表打開/使用JavaScript關閉,但只需要在如何保持的幫助點擊並打開時滾動到該標題/部分頂部的內容。

http://jsfiddle.net/aaronblomberg/jtu49v22/

在此先感謝!一個小提琴的例子會是理想的!

回答

0

這裏是一個動畫滾動,將讓你開始:

$('a.toggle').on('click', function (e) { 
    e.preventDefault(); 

    var $this = $(this), 
     $child = $this.closest('tr.parent').next('tr.child'); 
    $this.closest('tr.parent').siblings('tr.child').not($child).hide(); 
    $child.toggle(); 
    // scroll heading to page top with arbitrary 60px difference 
    var top = $this.offset().top -60;   
    $('html,body').animate({scrollTop: top}) 
}); 

DEMO

相關問題