2010-12-23 4 views
2

가능한 중복 : 나는 라인의 수에 따라 텍스트 영역의 높이를 변경하려면 어떻게
Autosizing textarea using prototype변경 높이가 자바 스크립트에서 텍스트 줄의 수에 따라

사용자가 입력하는 텍스트

사용자가 텍스트 영역의 텍스트를 두 줄 이상의 텍스트로 변경 한 경우 텍스트 영역은 줄 수에 맞게 높이를 변경하는 대신 스크롤바를 놓습니다.

라인 높이에 맞게 "32"을 조정
<textarea> 
This is the default text that will be displayed in the browser. When you change this text and add more lines to it the browser will not change the height of the textarea that this text is in rather it will add a scroll bar, which is not what I want. 
<textarea> 
+2

@ FelixKling OP가 프로토 타입을 사용한다고 가정 할 때만, 그는 언급하지 않았습니다. – Chad

답변

1
<textarea onkeyup="autoSize(this);"></textarea> 

function autoSize(ele) 
{ 
    ele.style.height = 'auto'; 
    var newHeight = (ele.scrollHeight > 32 ? ele.scrollHeight : 32); 
    ele.style.height = newHeight.toString() + 'px'; 
} 

는 연습으로 남아 있습니다.

+0

작동하지 않습니다. http://jsfiddle.net/MYrG2/ –

+0

문제는 스크립트가 아니라 JSFiddle입니다. Chrome에서 : "안전하지 않은 JavaScript가 URL http://jsfiddle.net/MYrG2/의 프레임에 액세스하려고합니다. URL http://fiddle.jshell.net/MYrG2/show/이있는 프레임에서 도메인, 프로토콜 및 포트가 일치해야합니다." 크로스 사이트 스크립팅 오류, 기이 한. – JURU

+1

죄송합니다. 추가 사항 : Webkit에서이 문제를 해결하려면 텍스트 영역 스타일에 "overflow-y : hidden"을 추가해야합니다. – JURU

관련 문제