テキストエリアに読み込まれたファイルの文字数を数えますか？

Question

私はテキストエリア

function count_up(obj){ 
 
    document.getElementById('numbers').innerHTML = obj.value.length; 
 
}

<textarea name="textField" class="text_edit" id="my_text" onkeyup="count_up(this);"></textarea><br/> 
 
<span id="numbers">0</span>

に入力していたとき、私は文字の数をカウントすることができますが、私はテキストエリアにそれをロードする際に、ファイル内の文字の数をカウントします。この関数は大丈夫ですが、ファイル内の文字を数えたい場合は、読み込んだテキストに何かを追加する必要があります（ 直感的ではありません）。それを修正するために何かできますか？

Answer 1

このコードを使用して、keyupイベントの文字をカウントします。

function count_up(obj) { 
    var len = obj.value.length; 
    $("span#numbers").text(len); 
    }; 

Answer 2

約束を使用することを検討してください。ような何か：

function loadFile() { 
    return new Promise((resolve, reject) => { 
    try{ 
     //Function about loading file 
     //... 
     resolve(obj); 
    } catch (e) { 
     reject(e); 
    } 
    }); 
}; 

その後、次を使用して、カウントを得ることができる必要があります：

loadFile() //Will do count_up after the text is loaded 
    .then(function(obj){ 
     count_up(obj); 
    }) 
    .catch((reason) => { 
     console.log('Handle rejected promise ('+reason+') here.'); 
    }); 

Answer 3

textarea { 
 
     width: 100%; 
 
     height: 150px; 
 
     padding: 12px 20px; 
 
     box-sizing: border-box; 
 
     border: 2px solid #ccc; 
 
     border-radius: 4px; 
 
     background-color: #f8f8f8; 
 
     font-size: 16px; 
 
     resize: none; 
 
    }

<textarea name="" id="" cols="30" rows="10" onkeyup="countCharToMax(this)"></textarea> 
 
     <div id="charNum">0/30</div> 
 
    
 
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> 
 
    <script> 
 
     function countCharToMax(val) { 
 
      var max = 30; 
 
      var min = 0; 
 
      var len = val.value.length; 
 
      if (len >= max) { 
 
       val.value = val.value.substring(min, max); 
 
       $('#charNum').text(len + '/'+max); 
 
      } else { 
 
       $('#charNum').text(len + '/'+max); 
 
     
 
      } 
 
     }; 
 
    </script>