[JavaScript] textarea 줄 수 제한 (Limit number of lines in textarea)

2019. 5. 7. 18:41· WEB/JavaScript
반응형

[JavaScript] textarea 줄 수 제한 (Limit number of lines in textarea)


 

textarea의 keypress이벤트에 현재 입력된 값의 줄 수와 textarea에 선언한 rows 를 비교해서 

엔터(keycode 13)가 입력되었을 때, 현재 textrea의 줄 수와 rows가 같은 경우 false를 리턴해주면 된다.

 

 

HTML

<textarea rows="4" onkeydown="return limitLines(this, event)"></textarea>

 

javascript

// textarea 줄 수 제한
function limitLines(obj, e) {
    // 현재 textarea에 입력된 줄 수
    let numberOfLines = (obj.value.match(/\n/g) || []).length + 1;
    // textarea에 선언된 rows 수
    let maxRows = obj.rows;
    if (e.which === 13 && numberOfLines === maxRows) {
        return false;
    }
}

 

반응형
저작자표시 비영리 변경금지 (새창열림)

'WEB > JavaScript' 카테고리의 다른 글

[JavaScript] Bootstrap-Select 관련  (0) 2019.05.28
[JavaScript] image refresh 오류  (0) 2019.05.09
[JavaScript] gulp  (0) 2019.05.03
[Javascript] Learning Javascript (진행중)  (0) 2019.05.01
[JavaScript][ES6] Did you forget to signal async completion? 오류 해결 방법  (0) 2019.04.24
'WEB/JavaScript' 카테고리의 다른 글
  • [JavaScript] Bootstrap-Select 관련
  • [JavaScript] image refresh 오류
  • [JavaScript] gulp
  • [Javascript] Learning Javascript (진행중)
S0PH1A
S0PH1A
반응형
S0PH1A
Web Programmer
S0PH1A
전체
오늘
어제
  • 전체
    • About Me
    • Python
      • Python
      • Django
    • DataBase
      • MySQL
      • MongoDB
    • JAVA
      • JAVA
      • Spring
    • WEB
      • JavaScript
      • HTML
      • CSS
      • Vue.js
      • React
      • Nest.js
      • Node.js
      • Electron
      • PHP
    • Linux
    • Algorithm
    • 기타
    • 생각
    • App
      • ReactNative

블로그 메뉴

  • 홈
  • 태그
  • 방명록

공지사항

인기 글

태그

  • django
  • Python
  • Error
  • vue.js
  • javascript
  • mysql
  • nodejs
  • electron
  • install
  • vue

최근 댓글

최근 글

hELLO · Designed By 정상우.v4.2.2
S0PH1A
[JavaScript] textarea 줄 수 제한 (Limit number of lines in textarea)
상단으로

티스토리툴바

개인정보

  • 티스토리 홈
  • 포럼
  • 로그인

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.