我使用 html 和 javascript 创建了一个窗口来显示我的网站生成的日志消息。我想将其设置为当用户打开日志窗口时它会自动滚动到日志消息的底部。我已经得到它，以便日志消息正确显示，但我无法让自动滚动工作。
我的 html/javascript 看起来像这样：
<body>
<div class="container-fluid">
<div class="panel panel-default">
<div class="panel-heading text-center">
<h4 class="text-center">Log Messages</h4>
</div>
<div class="panel-body">
<div class="content" id="logtext">
<font face="courier">
<span id="show" class='value'></span>
</font>
</div>
</div>
</div>
<script language="javascript" type="text/javascript">
function saveLogs(data){
sessionStorage.setItem("logs",data.message);
}
$(document).ready(
function() {
setInterval(function() {
Dajaxice.InterfaceApp.getLogs(saveLogs);
var logs = sessionStorage.getItem("logs");
document.querySelector('.content .value').innerText = logs;
//I tried doing this and nothing happened.
var objDiv = document.getElementById("logtext");
objDiv.scrollTop = objDiv.scrollHeight;
}, 1000);
});
</script>
</div>
</body>
对的调用dajaxice基本上只是抓取我拥有的日志文件的最后 n 行，然后将它们发送到我定义为 的 js 函数saveLogs()。
我尝试过使用类似问题中给出的一些解决方案，但没有运气让它们发挥作用。
编辑 我尝试像这样设置它：
<div class="panel-body">
<div class="content" id="logtext">
<script language="javascript" type="text/javascript">
document.getElementById('bottomspan').scrollIntoView();
</script>
<font face="courier">
<span id="show" class='value'>
</span>
<div id='bottomspan'></div>
</font>
</div>
</div>
</div>
<script language="javascript" type="text/javascript">
function saveLogs(data){
sessionStorage.setItem("logs",data.message);
}
$(document).ready(
// document.getElementById('bottomspan').scrollIntoView();
function() {
setInterval(function() {
Dajaxice.InterfaceApp.getLogs(saveLogs);
var logs = sessionStorage.getItem("logs");
document.querySelector('.content .value').innerText = logs;
var el = document.getElementById('bottomspan')
el.scrollIntoView();
var height = el.style.clientHeight
window.scrollBy(0, height);
},700);
});
</script>
这很有效，除了每次页面刷新新消息时它都会返回到底部；这使得很难在顶部查看较旧的消息。有没有办法让它从 div 的底部开始，但如果用户正在查看顶部附近的消息，则不会强迫用户返回？
在这里尝试：
document.getElementById('logtext').scrollIntoView();
编辑
document.getElementById('bottomspan').scrollIntoView();
<font face="courier">
<span id="show" class='value'> content....
<span id='bottomspan'></span>
</span>
</font>
编辑
var el = document.getElementById('logtext')
el.scrollIntoView();
var height = el.style.clientHeight
window.scrollBy(0, height - window.innerHeight);
编辑回答 编辑
<script language="javascript" type="text/javascript">
function saveLogs(data){
sessionStorage.setItem("logs",data.message);
}
$(document).ready(
function() {
setInterval(function() {
Dajaxice.InterfaceApp.getLogs(saveLogs);
var logs = sessionStorage.getItem("logs");
document.querySelector('.content .value').innerText =
},700);
var el = document.getElementById('bottomspan')
el.scrollIntoView();
var height = el.style.clientHeight
window.scrollBy(0, height);
});