Wie kann ich Formulardaten mit JavaScript/jQuery abrufen?

Abrufen von Formulardaten mit JavaScript/jQuery

Formularübermittlungen erfordern häufig das Abrufen von Formulardaten zur Validierung oder Verarbeitung auf der Clientseite. Zu diesen Daten gehören Eingabefelder, Auswahllisten und andere Elemente. Eine häufig gestellte Frage ist, wie man diese Daten auf vereinfachte Weise erhält.

Verwendung der Methode serializeArray() von jQuery

Eine elegante Lösung besteht darin, die Methode jQuery() zu nutzen. Dies gibt ein Array von Objekten zurück, die die Formulardaten darstellen. Diese Methode serialisiert das Formular effektiv in ein Array von Schlüssel-Wert-Paaren:

$(function () {
    var formData = $('#form').serializeArray();
});

Wenn Ihr Formular beispielsweise die folgenden Felder enthält:

<input type="radio" name="foo" value="1" checked="checked" />
<input type="radio" name="foo" value="0" />
<input name="bar" value="xxx" />
<select name="this">
    <option value="hi" selected="selected">Hi</option>
    <option value="ho">Ho</option>
</select>

Die Ausgabe lautet:

[
  {"name":"foo","value":"1"},
  {"name":"bar","value":"xxx"},
  {"name":"this","value":"hi"}
]

Verwenden der Methode serialize() von jQuery

Alternativ können Sie jQuery() verwenden, um eine Abfragezeichenfolgendarstellung der Formulardaten zu erstellen:

$(function () {
    var formData = $('#form').serialize();
});

Diese Methode gibt eine Zeichenfolge aus, die durch kaufmännische Und-Zeichen getrennte Schlüssel-Wert-Paare enthält und zur Übermittlung an einen Server geeignet ist:

"foo=1&bar=xxx&this=hi"

Demonstration

Sehen Sie sich a an Praktische Demonstration des Abrufens von Formulardaten mit beiden jQuery-Methoden in dieser JSFiddle: https://jsfiddle.net/t7hvjne1/

Das obige ist der detaillierte Inhalt vonWie kann ich Formulardaten mit JavaScript/jQuery abrufen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!