Wie erzwinge ich Zeichenbeschränkungen für TextAreas in HTML ohne Event-Handler?

Durchsetzung von TextArea-Zeichenbeschränkungen in HTML mit JavaScript

JavaScript erweitert die durch das HTML-Attribut „maxlength“ bereitgestellte Funktionalität und bietet eine vielseitige Lösung für automatische Festlegung von Zeichenbeschränkungen für Textbereiche. Da keine manuelle Ereignisbehandlung mehr erforderlich ist, bietet dieser Ansatz eine optimierte und effiziente Möglichkeit, Eingabebeschränkungen durchzusetzen.

Maxlength ohne Ereignishandler festlegen

Der herkömmliche Ansatz zur Begrenzung Textbereichszeichen erfordern die Verwendung von Ereignishandlern wie onkeypress oder onkeyup. Dies wird jedoch mühsam, wenn Grenzwerte für mehrere Textbereiche angegeben werden müssen.

JavaScript ermöglicht eine elegantere Lösung, die die explizite Ereignisbehandlung umgeht:

<code class="javascript">window.onload = function() {
  // Retrieve all text areas on the page
  var txts = document.getElementsByTagName('TEXTAREA');

  // Loop through each text area
  for(var i = 0, l = txts.length; i < l; i++) {
    // If the textarea has a valid maxlength attribute (numeric value)
    if(/^[0-9]+$/.test(txts[i].getAttribute("maxlength"))) {
      // Define a function to handle maxlength enforcement
      var func = function() {
        var len = parseInt(this.getAttribute("maxlength"), 10);

        // Check if the input length exceeds the limit
        if(this.value.length > len) {
          // Alert the user and truncate the input
          alert('Maximum length exceeded: ' + len);
          this.value = this.value.substr(0, len);
          return false;
        }
      }

      // Assign the function to the onkeyup and onblur events
      txts[i].onkeyup = func;
      txts[i].onblur = func;
    }
  };
};</code>

Implementierungsdetails

• window.onload: Führt das Skript aus, sobald die Seite geladen ist.
• getElementsByTagName: Ruft alle Textbereichselemente auf der Seite ab Seite.
• Regex-Test:Überprüfen Sie, ob das Maxlength-Attribut ein gültiger numerischer Wert ist.
• func: Definiert eine Funktion, die prüft, ob die Eingabe erfolgt Die Länge überschreitet die maximale Länge und schneidet die Eingabe bei Bedarf ab.
• Ereignisbehandlung: Weist die Funktion func den Ereignissen onkeyup und onblur für jeden Textbereich mit einem gültigen maxlength-Attribut zu.

Vorteile

• Automatische Durchsetzung: Zeichenbeschränkungen werden automatisch festgelegt, ohne dass eine manuelle Ereignisbehandlung für jeden Textbereich erforderlich ist.
• Einfache Implementierung: Das bereitgestellte Skript vereinfacht den Prozess der Durchsetzung der maximalen Länge über mehrere Textbereiche hinweg.
• Modularer Ansatz: Die Logik zur Durchsetzung der maximalen Länge ist in einem abgeschlossen Funktion, die die Wiederverwendung oder Anpassung erleichtert.

Das obige ist der detaillierte Inhalt vonWie erzwinge ich Zeichenbeschränkungen für TextAreas in HTML ohne Event-Handler?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!