Eu tenho este código:

<div id="conversationDiv" style="overflow:auto">

    <label>What is your name?</label><input type="text" id="name" />
    <button id="sendName" onclick="sendName();updateScroll();">Send</button>
    <p id="response"></p>

</div>

E eu tenho essa função javascript que corro depois que clico no botão 'Enviar' e ela continua em execução após 1 segundo de intervalo.

<script type="text/javascript">
function updateScroll() {
        setInterval(function(){ var element = document.getElementById("conversationDiv");
        element.scrollTop = element.scrollHeight; }, 1000);
    }
</script>

Esta é a minha função sendName () se alguém quiser ver:

function sendName() {
        var name = document.getElementById('name').value;
        stompClient.send("/app/hello", {}, JSON.stringify({ 'name': name }));
    }

Mas o problema é que minha barra de rolagem nunca fica na parte inferior.

Estou executando uma conexão Websocket e as informações continuam chegando e, quando as informações são suficientes para a barra de rolagem aparecer, não quero que elas subam. Gostaria que ele permanecesse na parte inferior, a menos que um usuário faça o backup de si mesmo. Não sei por que meu código não está funcionando. Qualquer ajuda é apreciada. obrigado