Div溢出滾動到底部：可能嗎？

如果我有一個div與overflow:auto所以，這是一個滾動的div和我一起，使一個顯著滾動區域信息加載它，是有辦法，當我加載的資料，div顯示底部的結果嗎？或基本上滾動到底部？Div溢出滾動到底部：可能嗎？

我見過jQuery解決方案，但這是在HTA中使用，所以我不能使用jQuery。有沒有純粹的JavaScript方式來實現這一目標？

2011-01-05 thepip3r

var myDiv = document.getElementById('myDiv'); 
myDiv.scrollTop = myDiv.scrollHeight;

工作在Firefox，Safari，Opera或Chrome瀏覽器，甚至IE瀏覽器，這是比我能說的SSE測試案例I設置...大聲笑

我會告誡你關於他人提供的鈍的解決方案的咆哮，這裏是一個可用於即時消息類型客戶端的代碼示例。

document.body.onload = function() 
{ 
    var myDiv = document.getElementById('myDiv'); 
    // Pick your poison below, server sent events, websockets, AJAX, etc. 
    var messageSource = new EventSource('somepage'); 
    messageSource.onmessage = function(event) 
    { 
     // You must add border widths, padding and margins to the right. 
     var isScrolled = myDiv.scrollTop == myDiv.scrollHeight - myDiv.offsetHeight; 
     myDiv.innerHTML += event.data; 
     if(isScrolled) 
      myDiv.scrollTop = myDiv.scrollHeight; 
    }; 
};

該例子是有關檢查是否在div已滾動至底部，並且如果是這樣，將數據添加到它之後它滾動至底部的一部分。如果它尚未滾動到底部，則div的滾動位置將保持不變，以便div的可見內容不受添加數據影響。

來源

2012-05-24 23:52:49 Vreenak

使用EventSource的+1 – Purefan 2014-05-06 08:55:13

document.getElementById('mydiv').scrollTop = 9999999;

scrollTop屬性指定從區域頂部開始的滾動偏移量（以像素爲單位）。將它設置爲一個非常大的值會強制它到底部。

來源

2011-01-05 16:36:06 Phrogz

我試着使用：功能jsDivBottom（DIVID，strMsg）{ \t \t VAR myDiv =的document.getElementById（DIVID）; \t \t \t \t myDiv.innerHTML = strMsg \t \t myDiv.scrollTop = 9999999; \t} 它不滾動到底部。該消息正在申請，所以我知道其他部分正在工作......任何建議？ – thepip3r 2011-01-05 18:54:13

我將.scrollTop參數設置爲9999999後立即做出提示（），並且報告返回0.無論出於何種原因，即使我正在設置它，但似乎並沒有發生。 – thepip3r 2011-01-05 19:41:31

納米...我正在寫我的內容到一個跨度，並試圖設置它的scrollTop參數。我重新認識了封套，這部分工作。它似乎滾動約三分之一的方式。我試圖添加一些額外的9，但沒有效果。有什麼建議麼？ – thepip3r 2011-01-05 19:48:19

我認爲你需要在之後設置scrollTop 元素被更新。

setTimeout(function(){ el.scrollTop = 999999999 }, 10)

另外，至少在chrome中，99999999999會滾動到底部。但999999999999（額外9）將滾動到頂部。它可能會轉換爲webkit C端的int值。

來源

2012-05-02 01:44:08 dominic

這個怎麼樣？

function scroll_to_max(elm) { // {{{ 
    if(!scroll_to_max_el) { 
     scroll_to_max_el = elm; 
     setTimeout(scroll_to_max, 10); // Allow for the element to be updated 
    } else { 
     var el = scroll_to_max_el; 
     var t = el.scrollTop; 
     el.scrollTop = t+100; 
     if(el.scrollTop != t) { 
      setTimeout(scroll_to_max, 10); // Keep scrolling till we hit max value 
     } else { 
      scroll_to_max_el = null; 
     } 
    } 
} 
var scroll_to_max_el = null; // Global var! 
// }}}

（注：在Chrome只測試了吧...）

來源

2012-05-21 09:44:13 Toby

遲到的回答，但這是大有幫助

$('#mydiv').scrollTop(($('#mydiv').height()*2));

來源

2014-03-30 12:44:08 MichaelM

Div溢出滾動到底部：可能嗎？

回答

相關問題