#javascript #html
#javascript #HTML
Вопрос:
У меня есть программа, в которой пользователь что-то вводит, а затем что-то выводит в «консоль». Самая последняя введенная вещь остается внизу, если пользователь не прокручивает вверх
Похоже, что в теле моего документа я могу создавать эффекты dd, такие как скрытая прокрутка к нему. Я прочитал другой пост и использовал scrollTop и scrollHeight, и это не работает.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href = "style.css">
</head>
<body id = "scroll">
<div id="game">
<div id="console">
</div>
</div>
<div id = "command-box">
<div id = "cmd">
<input id = "command" onkeypress = "doAThing(event);">
</div>
</div>
</div>
<script src = "variables.js"></script>
<script src = "code.js"></script>
</body>
</html>
var input = document.querySelector("#command");
var theConsole = document.querySelector("#console");
theConsole.scollTop = theConsole.scrollHeight;
var myScroll = document.getElementById("scroll");
function doAThing(event) {
var theKeyCode = event.keyCode;
if(theKeyCode === 13) acceptCommand();
setInterval(scrollUpdate, 1000);
}
function scrollUpdate() {
myScroll.scrollTop = myScroll.scrollHeight;
}
function acceptCommand() {
var p = document.createElement("p");
if(input.value === "hi") theConsole.append("Hi!", p);
if(input.value === "ping") theConsole.append("Pong!", p);
}
Комментарии:
1. Вы могли бы установить флажок для «автопрокрутки» — это было бы проще.
2. Что бы я поставил для значения?