Heim > Web-Frontend > js-Tutorial > Wie kann ich eine POST-Anfrage in JavaScript wie eine Formularübermittlung simulieren?

Wie kann ich eine POST-Anfrage in JavaScript wie eine Formularübermittlung simulieren?

Mary-Kate Olsen
Freigeben: 2024-12-18 15:29:11
Original
205 Leute haben es durchsucht

How Can I Simulate a POST Request in JavaScript Like a Form Submission?

POST-Anfrage in JavaScript-ähnlicher Formularübermittlung

Um einen Browser auf eine andere Seite umzuleiten, kann eine GET-Anfrage verwendet werden, wie in Das folgende Beispiel:

document.location.href = 'http://example.com/q=a';
Nach dem Login kopieren

Für Ressourcen, die eine POST-Anfrage erfordern, ist jedoch ein anderer Ansatz erforderlich. HTML kann für statische Übermittlungen verwendet werden, wie gezeigt:

<form action="http://example.com/" method="POST">
    <input type="hidden" name="q" value="a">
</form>
Nach dem Login kopieren

Andererseits wird eine JavaScript-Lösung für dynamische Übermittlungen bevorzugt:

post_to_url('http://example.com/', {'q':'a'});
Nach dem Login kopieren

Browserübergreifende Kompatibilität erfordert eine umfassende Durchführung. Der folgende Code bietet eine einfache Lösung:

/**
 * sends a request to the specified url from a form. this will change the window location.
 * @param {string} path the path to send the post request to
 * @param {object} params the parameters to add to the url
 * @param {string} [method=post] the method to use on the form
 */

function post(path, params, method='post') {

  // The rest of this code assumes you are not using a library.
  // It can be made less verbose if you use one.
  const form = document.createElement('form');
  form.method = method;
  form.action = path;

  for (const key in params) {
    if (params.hasOwnProperty(key)) {
      const hiddenField = document.createElement('input');
      hiddenField.type = 'hidden';
      hiddenField.name = key;
      hiddenField.value = params[key];

      form.appendChild(hiddenField);
    }
  }

  document.body.appendChild(form);
  form.submit();
}
Nach dem Login kopieren

Beispielverwendung:

post('/contact/', {name: 'Johnny Bravo'});
Nach dem Login kopieren

Diese Methode stellt sicher, dass sich der Browserspeicherort ändert und simuliert die Formularübermittlung. Beachten Sie, dass die hasOwnProperty-Prüfung hinzugefügt wurde, um unbeabsichtigte Fehler zu verhindern.

Das obige ist der detaillierte Inhalt vonWie kann ich eine POST-Anfrage in JavaScript wie eine Formularübermittlung simulieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
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
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage