Como fazer o textarea rolar automaticamente quando há excesso de entrada?

Eu tenho 2 textareas. O primeiro é usado para digitar a entrada. Quando eu pressiono enter, a entrada é exibida na segunda caixa. Basicamente, o texto é apenas copiado/transferido.

Na segunda caixa, que exibe a entrada, tenho que rolar manualmente a barra de rolagem para ver a entrada mais recente. Como posso fazer o textarea rolar automaticamente para si mesmo quando uma nova entrada é digitada para que eu possa vê-la? Obrigado.

Resposta

Para fazer o textarea rolar automaticamente quando a entrada estoura, você pode seguir os seguintes passos:

1. Adicione o atributo `oninput` ao seu textarea de entrada para chamar uma função JavaScript toda vez que houver uma entrada de texto.

html

2. Em seguida, crie a função `scrollTextarea()` no seu arquivo JavaScript para rolar automaticamente o textarea de exibição sempre que houver uma nova entrada.

javascript
function scrollTextarea() {
let input = document.getElementById('input');
let output = document.getElementById('output');

// Copie o texto inserido para o textarea de exibição
output.value = input.value;

// Role automaticamente o textarea de exibição para a parte inferior
output.scrollTop = output.scrollHeight;
}

3. Certifique-se de que o `textarea` de exibição também tenha um `id` definido em seu HTML.

html

Com esses passos, o textarea de exibição deve rolar automaticamente para a parte inferior sempre que uma nova entrada estourar no textarea de entrada. Isso facilitará a visualização da entrada recente sem a necessidade de rolar manualmente a barra de rolagem.

Espero que isso ajude!