Heim > Web-Frontend > HTML-Tutorial > Wie können wir Textbereiche in HTML anzeigen?

Wie können wir Textbereiche in HTML anzeigen?

王林
Freigeben: 2023-08-21 23:25:08
nach vorne
2008 Leute haben es durchsucht

Wie können wir Textbereiche in HTML anzeigen?

Die Aufgabe, die wir in diesem Artikel lösen werden, ist, wie wir einen Textbereich in HTML anzeigen. Lassen Sie uns in den Artikel eintauchen, um eine klare Vorstellung davon zu bekommen, wie wir einen Textbereich anzeigen.

HTML-Textarea-Tag definiert ein mehrzeiliges Bearbeitungssteuerelement für Klartext. Da der Textbereich eine unbegrenzte Anzahl von Zeichen aufnehmen kann (normalerweise Courier), wird der Text in einer Schriftart mit fester Breite angezeigt. In Formularen werden Textfelder häufig zum Sammeln von Benutzereingaben wie Kommentaren oder Bewertungen verwendet. Nach dem Absenden des Formulars ist das Namensattribut für Referenzen in den Formulardaten erforderlich.

Sehen wir uns die folgenden Beispiele an, um mehr darüber zu erfahren, wie wir einen Textbereich in HTML anzeigen.

Beispiel 1

Im folgenden Beispiel verwenden wir ein mehrzeiliges Eingabesteuerelement.

<!DOCTYPE html>
<html>
<body>
   <form action="https://www.tutorialspoint.com/index.htm">
      <label for="name">NAME:</label><br>
      <input type="text" id="name" name="name"><br>
      <p><label for="comment">About Yourself:</label></p>
      <textarea id="comment" name="comment" rows="5" cols="35">
         I'm from Hyderabad,Telengana
      </textarea><br>
      <input type="submit" value="Submit">
   </form>
</body>
</html>
Nach dem Login kopieren

Während Sie das obige Skript ausführen, öffnet sich das Ausgabefenster mit einem Eingabefeld zur Eingabe Ihres Namens und einem Textbereich zur Vorstellung Ihrer Person sowie einer Schaltfläche zum Senden. Wenn Sie auf die Schaltfläche „Senden“ klicken, wird das Formular gesendet.

Beispiel 2: Verwendung von JavaScript

Anhand des folgenden Beispiels führen wir ein Skript aus, um den Kontext im Textbereich zu ändern.

<!DOCTYPE html>
<html>
<body>
   Address:<br>
   <textarea id="tutorial">
      kavuri incore 9
      Hyderabad
   </textarea>
   <button type="button" onclick="myFunction()">Click To Change</button>
   <script>
      function myFunction() {
         document.getElementById("tutorial").value = "Madhapur , Telangana";
      }
   </script>
</body>
</html>
Nach dem Login kopieren
Wenn das Skript ausgeführt wird, generiert es eine Ausgabe, die einen Textbereich mit dem mit Text gefüllten Adressfeld und eine Schaltfläche zum Ändern durch Klicken enthält

Wenn der Benutzer auf die Schaltfläche klickt, wird der Text im Textbereich geändert.

Die chinesische Übersetzung von

Beispiel 3

lautet:

Beispiel 3

Betrachten wir ein weiteres Beispiel: Wir verwenden das Textarea-Tag

<!DOCTYPE html>
<html>
<head>
   <title>HTML textarea Tag</title>
</head>
<body>
   <form action = "/cgi-bin/hello_get.cgi" method = "get">
      Enter subjects
      <br/>
      <textarea rows = "5" cols = "50" name = "description"></textarea>
      <input type = "submit" value = "submit" />
   </form>
</body>
</html>
Nach dem Login kopieren

Wenn das Skript ausgeführt wird, wird das Ausgabefenster angezeigt, das den Eingabetyp für Textara sowie eine Schaltfläche zum Senden bereitstellt.

Das obige ist der detaillierte Inhalt vonWie können wir Textbereiche in HTML anzeigen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:tutorialspoint.com
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage