Einführung und Beispiele für versteckte Felder in HTML

Einführung und Beispiele für versteckte Felder in HTML
Grundlegende Syntax:

<Eingabetyp="versteckt" Name="Feldname" Wert="Wert">

Wirkung:

1 Versteckte Felder sind für Benutzer auf der Seite unsichtbar. Der Zweck des Einfügens versteckter Felder in ein Formular besteht darin, Informationen zur Verwendung durch das Programm zu sammeln oder zu senden, das das Formular verarbeitet. Wenn der Betrachter auf die Schaltfläche „Senden“ klickt, um das Formular zu versenden, werden die Informationen in den ausgeblendeten Feldern auch an den Server gesendet.

2 Manchmal müssen wir Benutzern beim Absenden eines Formulars einige Informationen zur Bestätigung ihrer Identität geben, z. B. einen Sitzungsschlüssel usw. Natürlich können diese Dinge auch durch die Verwendung von Cookies erreicht werden, die Verwendung von ausgeblendeten Feldern ist jedoch viel einfacher. Und es wird keine Probleme geben, wenn der Browser Cookies nicht unterstützt oder Benutzer sie deaktivieren.

3 Manchmal gibt es in einem Formular mehrere Schaltflächen zum Senden. Wie kann das Programm erkennen, welche Schaltfläche der Benutzer zum Senden gedrückt hat? Wir können ein verstecktes Feld schreiben und dann zu jeder Schaltfläche onclick="document.form.command.value="xx"" hinzufügen. Nachdem wir die Daten erhalten haben, können wir zuerst den Wert des Befehls überprüfen, um zu wissen, welche Schaltfläche der Benutzer gedrückt hat, um ihn zu übermitteln.

4 Manchmal gibt es auf einer Webseite mehrere Formulare. Wir wissen, dass mehrere Formulare nicht gleichzeitig übermittelt werden können, aber manchmal interagieren diese Formulare miteinander. Wir können dem Formular versteckte Felder hinzufügen, um sie zu verbinden.

5 JavaScript unterstützt keine globalen Variablen, aber manchmal müssen wir globale Variablen verwenden. Wir können den Wert zuerst in einem versteckten Feld speichern und sein Wert geht nicht verloren.

6 Ein weiteres Beispiel ist, dass beim Drücken einer Schaltfläche vier kleine Fenster aufpoppen und beim Klicken auf eines der kleinen Fenster die anderen drei automatisch geschlossen werden. Der Internet Explorer unterstützt jedoch nicht, dass kleine Fenster sich gegenseitig aufrufen. Sie können daher nur ein verstecktes Feld in das übergeordnete Fenster schreiben. Wenn das kleine Fenster erkennt, dass der Wert des versteckten Felds nahe beieinander liegt, schließt es sich selbst.

Beispiel: Verwenden Sie „hidden“, um beim Klicken auf die Schaltfläche „Senden“ der Zahl 1 hinzuzufügen.

Wert automatisch erhöhen.htm

Code kopieren
Der Code lautet wie folgt:

<form action="Werterhöhung.ashx" method="post">
<Eingabetyp="versteckt" Name="_viewstate" Wert="a" />
<Eingabetyp="versteckt" Name="_div" Wert="@n" />
<!-- <input name="txt" type="text" value="@value" />-->
<div>@n</div>
<input type="senden" value="klicken" />
</form>

Verwenden einer allgemeinen Handlerimplementierung

Wert auto-increment.ashx

Code kopieren
Der Code lautet wie folgt:

Int. n = 0;
public void ProcessRequest (HttpContext Kontext) {
Kontext.Response.ContentType = "text/html";

Zeichenfolgenpfad = Kontext.Request.MapPath("Wertinkrement.htm");
Zeichenfolge html = System.IO.File.ReadAllText(Pfad);
//Überprüfen, ob die Seite zum ersten Mal geladen wird
Zeichenfolgenansichtsstatus = Kontext.Anforderung.Formular["_Ansichtsstatus"];
wenn (!string.IsNullOrEmpty(Ansichtszustand))
{
//Klicken Sie auf die Schaltfläche „Senden“.
//Holen Sie sich den Wert des versteckten Felds
Zeichenfolge s = Kontext.Anforderung.Formular["_div"];
wenn (int.TryParse(s, out n))
{
n++;
html = html.Replace("@n",n.ToString());
}
}
anders
{
//Die Seite wird zum ersten Mal geladen. Weisen Sie div und den entsprechenden versteckten Feldern div Werte zu.
html = html.Replace("@n", n.ToString());
}
Kontext.Antwort.Schreiben(html);
}

<<:  Beschreibung der Ausführungsmechanismen von statischen Seiten und dynamischen Seiten

>>:  So starten Sie ein Vue-Projekt mit dem M1 Pro-Chip

Artikel empfehlen

Kreativer Eröffnungseffekt durch die Kombination von CSS 3.0 mit Video

Ich möchte Ihnen einen kreativen Einstieg vorstel...

CocosCreator Universal Framework Design Network

Inhaltsverzeichnis Vorwort WebSocket verwenden Er...

So implementieren Sie Web-Stresstests mit Apache Bench

1. Einführung in Apache Bench ApacheBench ist ein...

Detaillierte Konfiguration des mysql8.x-Docker-Remotezugriffs

Inhaltsverzeichnis Umweltbedingungen Aufgetretene...

Einige Erfahrungen in der Selbstkultivierung von Künstlern

Da der Einfluss des Unternehmens wächst und seine...

Wichtige Hinweise zu PHP-HTMLhtml-Wissenspunkten (unbedingt lesen)

1. Verwenden Sie Frameset, Frame und Iframe, um m...

Dinge, die Sie nicht über die CSS-Pseudoelemente ::before und ::after wissen

CSS hat zwei Pseudoklassen, die nicht häufig verw...

Implementieren Sie ein einfaches Datenantwortsystem

Inhaltsverzeichnis 1. Dep 2. Verstehen Sie den Be...

So legen Sie in Linux eine feste IP fest (getestet und effektiv)

Öffnen Sie zunächst die virtuelle Maschine Öffnen...

So fügen Sie schnell 10 Millionen Datensätze in MySQL ein

Ich habe gehört, dass es eine Interviewfrage gibt...

Funktionen in TypeScript

Inhaltsverzeichnis 1. Funktionsdefinition 1.1 Fun...