0
私はXHR POSTリクエストを実装しています。これはローカルサーバ上のES2015約束です。json-serverです。 onsubmitでフォームを送信すると、フォームが空であるかのようにイベント・サーバーはデータを受信しません。しかし、私がPromiseオブジェクトを実行する前にエラー（throw SyntaxError; //またはconsole.log(undefinedVar)）を投げた場合、意図したとおりにサーバーにデータがポストされます。私はを試して、onsubmitイベントと約束の実行の間に少しの遅延を導入しようとしました。しかしそれでも動作しません。私はsend(new FormData(data));をHTMLElementフォームを直接データとして送る前に試みましたが、空のフォームもポストしています。XMLHttpRequest POSTフォームの入力がプロンプトで解析されていません
私はJSで非同期の新機能ですが、約束の中にある種の遅延の要件がありますか？それとも私が間違っているの？
私はエラーを挿入する必要があるコード。
function submitForm(form_Data) {
throw SyntaxError; //THE REQUIRED ERROR
getData(form_Data.method, form_Data.action, form_Data).then((res) => {
console.log(res);
}).catch((err) => {
console.log(err);
});}
完全なコード：エラーを投げる
"use strict";
function getData(method, url, data) {
\t return new Promise(function (resolve, reject) {
\t \t let xhr = new XMLHttpRequest();
\t \t xhr.open(method, url, true);
\t \t xhr.onload = function (e) {
\t \t \t e.preventDefault();
\t \t \t if (this.status >= 200 && this.status < 300) {
\t \t \t \t resolve(xhr.response);
\t \t \t } else {
\t \t \t \t reject({
\t \t \t \t \t status: this.status,
\t \t \t \t \t statusText: this.statusText
\t \t \t \t });
\t \t \t }
\t \t };
\t \t xhr.onerror = function() {
\t \t \t reject({
\t \t \t \t status: this.status,
\t \t \t \t statusText: this.statusText
\t \t \t });
\t \t };
\t \t xhr.send(data);
\t });
}
function submitForm(form_Data) {
\t throw SyntaxError;
\t getData(form_Data.method, form_Data.action, form_Data).then((res) => {
\t \t console.log(res);
\t }).catch((err) => {
\t \t console.log(err);
\t });
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Ajax</title>
</head>
<body>
<header>
<h2>Json and Ajax</h2>
<form id="formFirst" method="POST" action="http://localhost:3000/posts" onsubmit="submitForm(this); return false;">
<input id="input1" name="input1" type="text">
<input id="input2" name="input2" type="text">
<input type="submit">
</form>
</header>
<script src="js/main.js" charset="utf-8"></script>
</body>
</html>
これも使用しましたが、FormDataは常に空のオブジェクトを返します。 – Ahmad
FormDataコンストラクターに渡したデータとして渡しているのと同じHTMLFormElementが動作しますが、動作しません。それは空を返します – Ahmad
ブラウザの開発者ツールのネットワークタブを確認してください - フォームデータが送信されているのを見てください - あなたがしていることが 'console.log（new FormData（data））'とは信じていません。空のFromDataオブジェクトのような "見た目" –