Falleinführung: Wir sehen häufig einige Websites mit Textfeldfeldern. Bei der Eingabe finden Sie Texteingabeaufforderungen unten, wie viele Wörter Sie eingeben können. Heute soll diese Funktion implementieren. Da eine Seite über mehrere Textbereiche verfügt, ist es natürlich nicht möglich, eine einzelne JS -Logik zur Kontrolle zu verwenden, sodass sie auf kleine Weise eingekapselt werden muss. Natürlich hat meine Verpackung noch einige Mängel, aber die grundlegende Funktion wird implementiert.
Stellen Sie zunächst einen einzelnen Textbereichsimplementierungsfall ein
HTML -Teil:
<textArea id = "text_txt1"> </textarea> <span id = "num_txt1"> Die verbleibenden 600 Wörter können eingegeben werden </span>
JS Teil:
$ (function () {$ ('#text_txt1'). on ('keyUp', function () {var txtval = $ ('#text_txt1'). Val (). Länge; console.log (txtval); var str = parseInt (600-txtval); console.log (str. ) {$ ('#num_txt1'). als oder gleich 0, die Anzahl der Wörter kann nicht erhöht werden, es kann nur 600 Wörter sein} // console.log ($ ('#num_txt'). html (str));});})Führen Sie dann mehrere Texte -Implementierungsfälle unter derselben Seite ein
Funktion änderungen (obj, num) {obj.on ('keyUp', function () {var txtval = obj.val (). Länge; // console.log (txtval); var st = parseInt (600-txtval); // console.log (str); {num.html ('Restable Input 0 Wörter'); obj.val (obj.val (). substring (0, 600));} // console.log ($ ('#num_txt'). ChangeLength ($ ('#text_txt1'), $ ('#num_txt1')); Changelength ($ ('#text_txt2'), $ ('#num_txt2'); c Hangelength ($ ('#text_txt3'), $ ('#num_txt3')); änderung ($ ('#text_txt4'), $ ('#num_txt4');});Natürlich kann die hier benötigte Wortzahl auch innerhalb der Funktion eingekapselt werden, aber ich werde sie nicht zusammenfassen. Dies erkennt, dass beim Eingeben von Text die verbleibenden Wörter automatisch in der Spannweite angezeigt werden. Wenn der Eingangswert den höchsten Wert erreicht, werden die verbleibenden Wörter als 0 angezeigt und der Inhalt kann nicht in neuen Inhalten ausgefüllt werden. Beim Löschen von Text kann Span die verbleibende Wortzahl dynamisch erhalten.
Im Folgenden finden Sie die Codes anderer, und diesmal habe ich auch einige der Schreibmethoden anderer geliehen
HTML:
<div><p>Introduction:</p><textarea id="content" name="sign" style="height:60px;overflow-y: hidden;"onkeyup="changeLength(this,60)"></textarea><div><h3>60</h3></div></div>
JS:
// Überprüfen Sie die Länge der TextArea -Funktions -ChangeLength (OBJ, LG) {var len = $ (obj) .val ();Das obige ist die Methode, um dynamische verbleibende Wörter in textarea basierend auf JS zu erhalten, die vom Editor eingeführt wurden. Ich hoffe, es wird für alle hilfreich sein. Wenn Sie Fragen haben, hinterlassen Sie mir bitte eine Nachricht und der Editor wird allen rechtzeitig antworten. Vielen Dank für Ihre Unterstützung auf der Wulin.com -Website!