ケースの紹介：Textareaテキストボックスを備えたいくつかのWebサイトがよく表示されます。入力すると、テキストプロンプトがあります。今日はこの機能を実装することです。もちろん、ページにはいくつかのTextareasがあるため、制御に単一のJSロジックを使用することはできないため、小さな方法でカプセル化する必要があります。もちろん、私のパッケージにはまだいくつかの欠点がありますが、基本的な機能が実装されています。
まず、単一のTextarea実装ケースを紹介します
HTMLパーツ：
<textarea id = "text_txt1"> </textarea> <span id = "num_txt1">残りの600語を入力できます</span>
JSパート：
$（function（）{$（ '＃text_txt1'）。 '+str+' word '）;} else {$（'＃num_txt1 '）。html（'残りは0語を入力できます '）; $（'＃text_txt1 '）。 words} // console.log（$（ '＃num_txt'）。html（str））;}）;}）次に、同じページの下に複数のTextareaの実装ケースを紹介します
function changeLength（obj、num）{obj.on（ 'keyup'、function（）{var txtval = obj.val（）。長さ; // console.log（txtval）; var str = parseint（600-txtval）; // console.log（str）; {num.html（ '残り可能な入力0単語'）; obj.val（obj.val（）。substring（0、600））;} // console.log（$（ '＃num_txt'）。html（str））;}）;} $（function（）{//ここに4つあります。 changeLength（$（ '＃text_txt1'）、$（ '＃num_txt1'））; changeLength（$（ '＃text_txt2'）、$（ '＃num_txt2'））; c Hungelength（$（ '＃text_txt3'）、$（ '＃num_txt3'））; changeLength（$（ '＃text_txt4'）、$（ '＃num_txt4'））;}）;もちろん、ここで必要な単語数も関数内にカプセル化することができますが、カプセル化しません。これは、テキストを入力すると、残りの単語がスパン内に自動的に表示されることを認識しています。入力値が最も高い値に達すると、残りの単語は0として表示され、コンテンツを新しいコンテンツで入力することはできません。テキストを削除すると、SPANは残りの単語数を動的に取得できます。
以下は他の人のコードであり、今回は他の人の執筆方法のいくつかも借りました
HTML：
<div> <p>はじめに：</p> <textarea id = "content" name = "sign" style = "height：height：height：hidden;" onkeyup = "changeLength（this、60）"> </textarea> <h3> 60 </h3> </div> </div>
JS：
// textarea関数ChangeLength（obj、lg）の長さを確認します{var len = $（obj）.val（）; $（obj）.next（）。find（ "h3"）。text（lg-len.length）; if（len.length> = lg）{$（obj）.next（ "h3"）。上記は、編集者によって導入されたJSに基づいて、Textareaで動的な残りの単語を取得する方法です。私はそれが誰にでも役立つことを願っています。ご質問がある場合は、メッセージを残してください。編集者は、すべての人に時間内に返信します。 wulin.comのウェブサイトへのご支援ありがとうございます！