내용에 따라 텍스트 영역의 행 수를 지정하십시오. HTML, Javascript

안녕하세요, 사용자가 입력 할 때 텍스트 영역의 행 수를 늘리는 기능이있어서 잘 작동합니다. 그러나 사용자가 입력하지 않아도 양식이 텍스트 영역에 텍스트를 가져 오면 행 수가 증가하지 않지만 필요한 경우 처음에 정의 된 행 수 (행 = "1") 만 표시합니다. 가장 작은 수의 행이어야합니다.내용에 따라 텍스트 영역의 행 수를 지정하십시오. HTML, Javascript

텍스트 영역에 적용 할 Javascript (JQuery 없음) 함수가 무엇인지 모르기 때문에 행 수가 늘어 났을 때, 사용자가 입력 할 때 및 양식에서 여러 줄의 텍스트를 텍스트 영역으로 가져 오는 경우, 그래서 항상 최소한의 행을 사용합니다.

도움을 주시면 감사하겠습니다.

완전히 변경 한 기능을 떨어 뜨려주세요.

예 :

<script type="text/javascript"> 
function changeTextAreaLength(e){ 
    var txtLength = e.value.length; 
    var numRows = 0 ; 
    var arrNewLines = e.value.split("\n"); 

    for(var i=0; i<=arrNewLines.length-1; i++){ 
     numRows++; 
     if(arrNewLines[i].length > e.cols-5) { 
      numRows += Math.floor(arrNewLines[i].length/e.cols) 
     } 
    } 
     if(numRows < 1) { 
      e.cols = (txtLength % e.cols) + 1 >= e.cols ? ((txtLength % e.cols) + 1) : e.cols ; 
     }else{ 
      e.cols = e.cols ;  
      e.rows = numRows; 
     } 
} 
</script> 


<textarea id="textarea1" rows="1" onkeyup="javascript:changeTextAreaLength(this);" />

출처

2010-02-05 Amra

코드에 오류가 있습니다. 'funcntion' 오타를 수정하고 함수 인자'obj'를'e'로 변경하고'onkeyup'에서 호출과 일치하도록 함수의 이름을 변경하십시오 – meagar

고마워요, 이미 맞습니다. . – Amra

그래, keyup 거의 충분 입력의 내용을 변경할 수있는 모든 방법을 잡을 수 없습니다. 마우스 오른쪽 버튼으로 잘라내 기/복사/붙여 넣기, 실행 취소/다시 실행, 드래그/드롭 및 맞춤법 교정 기능을 사용하여 스크립팅 된 변경 사항을 검토 할 수도 있습니다.

이러한 모든 사례를 포착 할 의사가 없으므로 일반적인 실시간 반응에 변경 사항을 적용하려면 대체 방법이 없지만 폴링 (예 : 간격 사용)이 필요합니다. poller보다 빠른 지연으로 타이핑하는 일반적인 경우를 포착하려면 키 업을 추가 할 수 있습니다.

문자 계산에 대한 대안으로 scrollHeight을 검사하여 텍스트 영역이 스크롤되기 시작했는지 여부를 확인할 수도 있습니다. 예. 예 :

<textarea id="q" rows="4" cols="80">hello</textarea> 
<script type="text/javascript"> 
    function stretchy(element) { 
     var value= element.value; 
     function update() { 
      var h= element.scrollHeight; 
      if (h>element.offsetHeight || h<element.offsetHeight-48) 
       element.style.height= (h+24)+'px'; 
     } 
     element.onkeyup= update; 
     setInterval(update, 1000); 
     update(); 
    } 

    stretchy(document.getElementById('q')); 
</script>

출처

2010-02-05 16:53:23 bobince

+1, 좋은 답변 – glomad

먼저 "fucntion"을 "function"으로 변경하십시오.

둘째, onkeyup 속성에서 "javascript :"를 제거하십시오.

셋째, changeTextAreaLength()를 호출하지만 함수의 이름은 expandtextarea()입니다.

넷째, 함수가 expandtextarea (obj)라고 말했지만 함수 내에서 obj가 아니라 e를 참조합니다.

<textarea id="textarea1" rows="1" onkeyup="expandtextarea(this);" />

출처

2010-02-05 16:50:01 glomad

내용에 따라 텍스트 영역의 행 수를 지정하십시오. HTML, Javascript

답변

관련 문제