Question

138

Textarea auto-scroll to the bottom

rated 0 times [ 139] [ 1] / answers: 1 / hits: 29135 / 10 Years ago, fri, october 24, 2014, 12:00:00

I have a textarea that I append data to with textarea.value += more textn; and I would like it to stay scrolled to the bottom, so it would always show the last line.

I have read that I should do:

var textarea = document.getElementById('textarea_id');

textarea.scrollTop = textarea.scrollHeight;

But I tried that (http://jsfiddle.net/BenjiWiebe/mya0u1zo/) and I can't get it to work.

What am I doing wrong?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

demondp

Add To Favorites

Follow

Total Points: 154

Total Questions: 97

Total Answers: 99

Location: Mali

Member since Thu, Jul 9, 2020

4 Years ago

demondp questions

1 How to pass params in Nuxt 3 server/api?

Sat, May 28, 22, 00:00, 2 Years ago

1 TypeError: Cannot read properties of undefined (reading 'state') reactjs

Sun, Sep 26, 21, 00:00, 3 Years ago

1 How to make the pino library as generic and call everywhere in the project

Fri, May 15, 20, 00:00, 4 Years ago

1 how to fetch and display images from database in react app

Thu, Jul 18, 19, 00:00, 5 Years ago

1 Cannot find JS files -- Failed to load resource: the server responded with a status of 404 ()

Wed, Apr 24, 19, 00:00, 5 Years ago

View All

answered 10 Years ago micheleb · Accepted Answer

You need to set scrollTop each time you append text:

var textarea = document.getElementById('textarea_id');

setInterval(function(){

    textarea.value += Math.random()+'n';

    textarea.scrollTop = textarea.scrollHeight;

}, 1000);

http://jsfiddle.net/mya0u1zo/2/