즉석 단어 카운터

Question

나는 입력 한 모든 단어가 증가하는 큰 텍스트 상자 (블로그 편집기를 생각해 보라)에 단어 카운터를 추가하고 싶다. (즉, "Hello"를 입력하면 0부터 1까지 증가하고 이후에 "world"를 쓰면 2로 증가합니다). 웹 페이지에서이 작업을하고 싶지만 다른 옵션을 사용해도 좋습니다.

어떻게해야할지 모르겠다. 나는 Javascript로 이것을 할 수있는 방법이있을 것이라고 생각하지만 Javascript에 대해서는 아무 것도 모른다.

누군가이 방법을 알아내는 방향으로 나를 가리킬 수 있습니까?

Answer 1

입력 된 문자를 확인하는 것이 좋습니다 (예 : onKeyUp 이벤트). 이전 문자가 공백이 아니고 현재 문자가 아닌 경우 증분 수입니다. 세부 사항 : 이전 문자가 문자가 아닌 경우 증가하지 않아야합니다 (이중 공백 문자)

사용자가 Backspace 또는 Delete 키를 누르면 유사한 확인이 수행됩니다. 찾을 수있는 키 코드 here

'즉시'로 계산하는 것이 어려운 것은 '비키'입력을 확인하는 것입니다. 예를 들어, 사용자는 Ctrl+Insert 조합을 사용하여 클립 보드에서 데이터를 복사하거나 텍스트 상자에서 텍스트를 선택한 다음 Del 키를 누릅니다. 정말 가치가있을 수있는 전체 가치 처리를 피할 필요가 있다면 별도로 처리해야합니다.

Answer 2

텍스트 상자의 onkeyup 이벤트에서이 기능을 사용하십시오.

document.getElementById("inputbox").addEventListener("keyup",function(e){ 
    // Get the inputs text. 
    var inputVal = e.srcElement.value; 
    var counter = 0; 
    // Check input isn't empty. 
    if(inputVal){ 
     // Count individual letters. 
     var wordlist = inputVal.split(" "); 
     for(var i=0;i<wordlist.length;i++) 
      if(wordlist[i]) 
       counter = counter+1; 
    } 
    // Then set your counter element. 
    document.getElementById("counter").value = counter; 
});