Подтвердить что ты не робот

Могу ли я сделать textarea расти с текстом до максимальной высоты?

Я работаю над проектом, где у меня есть данные в div, которые могут быть разных размеров. Когда пользователь нажимает на один из div, он должен превратиться в редактируемое текстовое поле. Ширина постоянна, но я бы хотел, чтобы высота начиналась как высота исходного div, а затем возрастала до максимальной высоты, прежде чем добавлять полосу прокрутки. Возможно ли это?

4b9b3361

ОТВЕТЫ

Ответ 1

Вы можете использовать contenteditable и ввести пользователя в прямую div, здесь демо: http://jsfiddle.net/gD5jy/

HTML

<div contenteditable>
    type here...
</div>

CSS

div[contenteditable]{
    border: 1px solid black;
    max-height: 200px;
    overflow: auto;
}

Ответ 2

Вот функция JavaScript

// TextArea is the Id from your textarea element
// MaxHeight is the maximum height value
function textarea_height(TextArea, MaxHeight) {
    textarea = document.getElementById(TextArea);
    textareaRows = textarea.value.split("\n");
    if(textareaRows[0] != "undefined" && textareaRows.length < MaxHeight) counter = textareaRows.length;
    else if(textareaRows.length >= MaxHeight) counter = MaxHeight;
    else counter = 1;
    textarea.rows = counter; }

вот стиль css

.textarea {
height: auto;
resize: none; }

и вот код HTML

<textarea id="the_textarea" onchange="javascript:textarea_height(the_textarea, 15);" width="100%" height="auto" class="textarea"></textarea>

он отлично работает для меня