如何讓滾動條停留在底部？

Question

我有一個web應用程序執行某些任務，並在web應用程序中創建了一個選項卡式框，它將打印任何日誌信息到指定區域。

正如你從下面的代碼可以看到，我有三個選項卡，當點擊一個，我有JavaScript和jQuery顯示與該選項卡相關聯的div區域。在每個div區域下面都會有一個嵌套的div用於日誌打印。

除了不停留在底部的滾動條之外，所有工作都很棒。

我曾嘗試：

HTML：

<div id="main" class="main"> 
     <div id="tabbed-box"class="tabbed-box"> 
       <ul id="tabs" class="tabs"> 
       <li><a href="#">Tail</a></li> 
       <li><a href="#">Access Log</a></li> 
       <li><a href="#">Conduit Log</a></li> 
      </ul> 

       <div id="tail_box" class="tabbed-content"> 
      <div id="tail_print" class="print-area"></div> 
      </div> 

      <div id="access_content" class="tabbed-content">   
        <div id="access_log_print" class="print-area"></div> 
      </div> 

      <div id="log_content" class="tabbed-content"> 
     <div id="log_keywords" class="keywords"></div> 
       <div id="log_print" class="print-area"></div> 
      </div> 
    </div> 

的jQuery：

document.getElementById("access_log_print").scrollTop = document.getElementById("access_log_print").scrollHeight; 

，但沒有運氣。所有div的class="print-area"我需要滾動條位於底部。

Answer 1

如果你使用的是jQuery，那麼你可以試試這個。

$('.print-area').each(function(){ 
    $(this).scrollTop($(this).prop('scrollHeight')); 
});