javascript textarea scrollTop

我試圖啓用複選框，一旦用戶讀取所有的協議。然而，好吧，我嘗試過使用Google搜索，但也無濟於事。我試圖得到scrollTop的「真正」結束，但由於不同的渲染引擎（gecko，webkit，blah blah？），固定值不起作用。javascript textarea scrollTop

這是我學習的一部分，所以請避免使用庫發佈解決方案。

有什麼建議嗎？

來源

2010-01-12 allenskd

您可以嘗試使用textarea的scrollHeight屬性，並將其與scrollTop進行比較 - 如果它們相等，則用戶位於最底部。

來源

2010-01-12 03:10:56

嘗試這樣，它不會工作，因爲寬度約爲400+，當我滾動最後它給了我288。 – allenskd 2010-01-12 03:21:11

your_textarea.scrollTop + your_textarea.offsetHeight - your_textarea.scrollHeight應該給你你想要的。它可能會偏離幾個像素，所以我可能會允許它，如果它在-20範圍內。例如，我在textarea上粘貼了一大段隨機廢話，然後滾動到底部，然後運行該代碼，它給了我-2。這是因爲底部有時會出現一些空行。如果沒有空行，那麼理論上該值應該爲0（確保使用===與0比較）。

理論上。

來源

2010-01-12 03:13:16 Reid

找到滾動容器的高度（假定它有id="scroll"）

var container_real_height = document.getElementById('scroll').offsetHeight

現在計算

var container_content_height = document.getElementById('scroll').scrollHeight; 
var container_scroll_amount = document.getElementById('scroll').scrollTop;

如果container_content_height = container_scroll_amount + container_real_height（+ - 幾個像素），那麼你是在底部..

來源

2010-01-12 03:19:17

這是我的實現使用閾值（在這種情況下4）來確定textarea是否滾動編輯到底部（或幾乎底部）。我也包含了計算值的顯示。

使用的度量是scrollHeight,scrollTop和jQuery的元素height()。

'4'的閾值適用於IE8，Webkit瀏覽器和FF3.5。 FF3.5和Safari（Windows）中可以一路走0

<html> 
<head> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
<script type="text/javascript" > 
$(function() { 
$('#cb').hide(); //hide checkbox 
var scrollThreshold = 4; //threshold value 
var ta0 = $("#ta"); 
var ta = $("#ta")[0]; 
$("#ta").scroll(function(){ 
    var p = ta.scrollHeight - (ta.scrollTop + ta0.height()); 
    $('#pos').val(ta.scrollHeight + ' - (' + ta.scrollTop + ' + ' + ta0.height() + ') = ' + p); 
    if(p <= scrollThreshold) //if scroll value falls within threshold 
     $('#cb').show(); //show checkbox 
    } 
); 
}); 
</script> 
</head> 
<body> 
<textarea id="ta" style="width: 200px; height: 100px;">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, 
when an unknown printer took a galley of type and scrambled it to make a type specimen book.</textarea> 
<br /> 
<input type="text" id="pos" /> 
<input type="checkbox" id="cb" /> 
</body> 
</html>

這裏的Safari瀏覽器的截圖：

On Safari http://i46.tinypic.com/nej3ft.jpg

來源

2010-01-12 03:34:53

javascript textarea scrollTop

回答

相關問題