我从教程中复制了一些代码，它将表单内容发送到 API。该 API 是在 AWS 上设置的，如果我使用 Postman 向它发送一些 JSON，它就可以工作。但是 JavaScript 不工作。当我点击表单上的提交按钮时，sendDataToLambda 函数未执行。如果我将 onClick="sendDataToLambda()" 添加到提交按钮，则该函数将触发（但随后在 e.preventDefault() 行上失败，这是预期的行为）。
\n\n我已经检查了表单 ID 是否正确，并且侦听器设置是否正确，但我找不到错误。\n如果可能的话，我宁愿不使用 jQuery。
\n\n<body>\r\n <div class=container>\r\n <h1>Notes</h1>\r\n\r\n <form id="note-form" style="margin-top:50px;">\r\n <input type="text" id="subject" placeholder="Enter subject here\xe2\x80\xa6" class="form-control" /><br/>\r\n <textarea id="body" rows="3" placeholder="Enter body here\xe2\x80\xa6" class="form-control"></textarea><br/>\r\n <button type="button" class="btn btn-lg">Submit</button>\r\n </form>\r\n\r\n </div>\r\n\r\n <script type="text/javascript">\r\n // Adds an event listener to our form. When the form is submitted, it will send data to our Lambda function, which in turn, will send us an email.\r\n document.getElementById(\'note-form\').addEventListener(\'submit\', sendDataToLambda);\r\n\r\n // Now for the good stuff. This is the function that will send our data to AWS.\r\n function sendDataToLambda(e) {\r\n console.log(\'Submit clicked\')\r\n e.preventDefault();\r\n\r\n // Gets the values of each field in our form. This is the data we\'ll send to our Lambda function.\r\n var formSubject = document.getElementById(\'subject\').value;\r\n var formBody = document.getElementById(\'body\').value;\r\n\r\n // This is the endpoint we created in our API Gateway. This is where we make our POST request, which calls our Lambda function.\r\n var endpoint = \'https://################\';\r\n\r\n // Remember those form values we just grabbed? We\'re going to put them into an object here.\r\n var body = {\r\n subject: formSubject,\r\n body: formBody\r\n }\r\n\r\n // Here, we instantiate our Request. This is a special object used by the Fetch API so it knows where to send data, what data to send, and how to send it.\r\n var lambdaRequest = new Request(endpoint, {\r\n method: \'POST\',\r\n // Quick note: \'no-cors\' mode is for development on localhost only!\r\n mode: \'no-cors\',\r\n body: JSON.stringify(body)\r\n });\r\n\r\n // Call the Fetch API to make our request\r\n fetch(lambdaRequest)\r\n // This is where you can handle errors. This is just an example, so we won\'t cover that.\r\n .then(response => console.log(response))\r\n .catch(err => console.log(err));\r\n }\r\n</script>\r\n\r\n</body>\r\n</html>如果您希望onSubmit触发该事件，则需要确保您的表单具有提交按钮（必须将type 属性设置为submit）。
<button type="submit" ... >Submit</button>\n请参阅下面的代码以了解对代码的修改：
\n<body>\n <div class=container>\n <h1>Notes</h1>\n\n <form id="note-form" style="margin-top:50px;">\n <input type="text" id="subject" placeholder="Enter subject here\xe2\x80\xa6" class="form-control" /><br/>\n <textarea id="body" rows="3" placeholder="Enter body here\xe2\x80\xa6" class="form-control"></textarea><br/>\n <button type="submit" class="btn btn-lg">Submit</button>\n </form>\n\n </div>\n\n <script type="text/javascript">\n // Adds an event listener to our form. When the form is submitted, it will send data to our Lambda function, which in turn, will send us an email.\n document.getElementById(\'note-form\').addEventListener(\'submit\', sendDataToLambda);\n\n // Now for the good stuff. This is the function that will send our data to AWS.\n function sendDataToLambda(e) {\n console.log(\'Submit clicked\')\n e.preventDefault();\n\n // Gets the values of each field in our form. This is the data we\'ll send to our Lambda function.\n var formSubject = document.getElementById(\'subject\').value;\n var formBody = document.getElementById(\'body\').value;\n\n // This is the endpoint we created in our API Gateway. This is where we make our POST request, which calls our Lambda function.\n var endpoint = \'https://################\';\n\n // Remember those form values we just grabbed? We\'re going to put them into an object here.\n var body = {\n subject: formSubject,\n body: formBody\n }\n\n // Here, we instantiate our Request. This is a special object used by the Fetch API so it knows where to send data, what data to send, and how to send it.\n var lambdaRequest = new Request(endpoint, {\n method: \'POST\',\n // Quick note: \'no-cors\' mode is for development on localhost only!\n mode: \'no-cors\',\n body: JSON.stringify(body)\n });\n\n // Call the Fetch API to make our request\n fetch(lambdaRequest)\n // This is where you can handle errors. This is just an example, so we won\'t cover that.\n .then(response => console.log(response))\n .catch(err => console.log(err));\n }\n</script>\n\n</body>\n</html>