글자 수와 제한

에디터 아래 상태 표시줄에 글자 수, 공백 제외 글자 수, 단어 수, 바이트 수가 나옵니다. 댓글이나 짧은 소개글처럼 길이를 제한해야 하면 maxLength 를 줍니다.

createEditor('#editor', {
  toolbar: 'bold italic | link',
  maxLength: 100,
  height: 180,
});

세는 방법

• 글자: 줄바꿈을 뺀 글자 수. 한글 한 글자가 1입니다.
• 공백 제외: 띄어쓰기와 줄바꿈을 모두 뺀 수.
• 단어: 띄어쓰기로 나뉜 덩어리 수.
• 바이트: UTF-8 기준입니다. 한글 한 글자는 3바이트로 셉니다.

maxLength

maxLength 를 주면 상태 표시줄이 87 / 100 처럼 바뀌고, 넘으면 숫자와 테두리가 빨갛게 됩니다. 입력을 막지는 않습니다. 넘은 상태로 내용이 바뀔 때마다 maxlength 이벤트가 오니, 저장 버튼을 막거나 안내를 띄우는 데 쓰세요.

const editor = createEditor('#editor', { maxLength: 2000 });

editor.on('maxlength', ({ length, max }) => {
  submit.disabled = true;
  hint.textContent = length - max + '자 넘었습니다';
});
editor.on('change', () => {
  if (editor.getStats().chars <= 2000) submit.disabled = false;
});

getStats()

editor.getStats();
// { chars: 87, charsNoSpace: 70, words: 18, bytes: 245, paragraphs: 2 }

paragraphs 는 비어 있지 않은 문단·제목·목록 항목·인용·코드 블록의 수입니다. 상태 표시줄이 필요 없으면 statusbar: false 로 숨깁니다. 이때 아래쪽 높이 조절 손잡이도 함께 사라집니다.

옵션