ライブキャラクターカウンター

だから私は誰かが "textarea"でタイプするときにそれを作ろうとしています。そしてタイプする間にこれまでのタイプの文字数を表示します。以下のコードは、私がカウンターを持っているフィールドです。私は仕事のトラブルシューティングでキャラクターカウンターを欲しい。どのように私はそれについて行うことができます任意のアイデア？ライブキャラクターカウンター

<tr> 
        <td width="70%"> 
         <b>Troubleshooting</b><br /> 
        </td> 
        <td width="30%"> 
         <a href="javascript: validateHP()" onMouseover="buttonObject_HP.src='images/hp_1.png'" onMouseout ="buttonObject_HP.src='images/hp_0.png'"> 
         &nbsp;<img name="buttonObject_HP" src="images/hp_0.png" border=0 alt="" width="75" height="20"/></a>   
        </td> 
       </tr> 
      </table> 
      <textarea class="normal" id="Reported" name="Reported" rows="12" cols="51" onchange="validateText();"></textarea>

出典

2017-08-16 Tacoma

可能な重複を追加しましたテキストエリアの文字数をカウントする]（https://stackoverflow.com/questions/5371089/count-characters-in-textarea） – Nisarg

私はこれを試して、私が欲しいものではない。トラブルシューティングのようなトラブルシューティング（50文字）でライブを表示するようにしています。それには文字数制限があります。私はあなたの金額を表示したいと思っています。上がっていく。 – Tacoma

私は私が欲しかったものを手に入れる、以下を行いました。ヘッド次に

<script src="http://code.jquery.com/jquery-1.5.js"></script> 
    <script> 
     function countChar(val) { 
     var len = val.value.length; 
     if (len >= 10000) { 
      val.value = val.value.substring(50, 10000); 
     } else { 
      $('#charNum').text(2000 - len); 
     } 
     }; 
    </script>

に次のように置かれ

は私のトラブルシューティング

最後

<div id="charNum">Characters Left</div>

の下で、次のdivを置く私は[私のテキストエリアに次の

onkeyup="countChar(this)"

出典

2017-08-24 17:46:53 Tacoma

これはコードで使用できます。 AngularJSを使用します。

<!DOCTYPE html> 
 
<html> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
 
<body> 
 

 
<div ng-app=""> 
 
    
 
<p>Input something in the input box:</p> 
 
<p>Name : <input type="text" ng-model="name" placeholder="Enter name here"></p> 
 
<h1>{{name.length}}</h1> 
 

 
</div> 
 

 
</body> 
 
</html>

出典

2017-08-22 18:48:09

AngularJSを使用しない場合は、 'string.length'を使用することもできます。手動でボタンで更新する必要があります。 –

ライブキャラクターカウンター

答えて

関連する問題