我正在使用 Flask 开发一个 Web 应用程序，但在处理 AJAX POST 请求时遇到了问题。我正在处理一个注册页面。当我单击表单上的提交按钮时，没有任何反应，浏览器开发人员工具的网络选项卡中没有 XHR 条目，也没有控制台条目。我已经仔细检查了我的代码，但无法确定问题所在。有人可以帮我解决这个问题吗？
请在下面找到我的代码的相关部分：
#app.py
from flask import Flask, render_template, request
app = Flask(__name__)
from user import routes
@app.route('/', methods=['GET', 'POST'])
def home():
if request.method == 'GET':
return render_template("login/home.html")
else:
print("do not know")
# @app.route('/dashboard/')
# def dashboard():
# return render_template("login/dashboard.html")
if __name__ == "__main__":
app.run(debug=True)
创建用户文件夹来管理模型类和路径
#user/models.py
from flask import Flask, jsonify
class User:
def signup(self):
user ={
"_id":"",
"name":"",
"email":"",
"password":""
}
return jsonify(user), 200
\#user/routes.py
from flask import Flask
from __main__ import app
from user.models import User
@app.route('/user/signup', methods=\['POST'\])
def signup():
user = User()
return user.signup()
The view or HTML code
base.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap demo</title>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
<script src="/static/js/jquery.js"></script>
<script src="/static/js/scripts.js"></script>
</head>
<body>
{% block login_content %}
{% endblock login_content %}
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>
</body>
</html>
home.html
{% extends 'login/base.html' %}
{% block login_content %}
<div class="container d-flex justify-content-center mt-5">
<div class="card w-75 d-flex flex-column flex-wrap">
<div class="container-fluid card-header">
Featured
</div>
<div class="card-body">
<form class="container-fluid" id = "signup_form" name="signup_form">
<div class="mb-3 d-md-flex">
<label for="register_name" class="form-label col-md-2">Name</label>
<input type="text" class="form-control" id="register_name" name="register_name">
</div>
<div class="mb-3 d-md-flex">
<label for="register_email" class="form-label col-md-2">Email address</label>
<input type="email" class="form-control" id="register_email" name="register_email">
</div>
<div class="mb-3 d-md-flex">
<label for="register_password" class="form-label col-md-2">Password</label>
<input type="password" class="form-control" id="register_password" name="register_password">
</div>
<!-- <div class="mb-3 form-check">
<input type="checkbox" class="form-check-input" id="exampleCheck1">
<label class="form-check-label" for="exampleCheck1">Check me out</label>
</div> -->
<button type="submit" id="submit_signup_form" class="btn btn-primary">Sign Up</button>
</form>
</div>
</div>
</div>
{% endblock login_content %}
脚本.js
$("#signup_form").submit(function(e) {
var $form = $(this);
var $error = $form.find(".error");
var data = $form.serialize();
$.ajax({
url: "/user/signup",
type: "POST",
data: data,
dataType: "json",
success: function(resp) {
// window.location.href = "/dashboard/";
console.log(resp)
},
error: function(resp) {
// $error.text(resp.responseJSON.error).removeClass("error--hidden");
console.log(resp)
}
});
e.preventDefault();
});
我已经验证包含 jQuery 并且 JavaScript 文件的路径是正确的。
我的服务器正在运行并且可以通过指定的 URL 进行访问。
Flask 路由似乎配置正确，但我在浏览器中没有得到预期的响应。
表单 ID 和表单名称之间也发生了变化
我非常感谢您提供的任何指导或见解来帮助我解决此问题。预先感谢您！
按钮 ID 为
submit_signup_form<button type="submit" id="submit_signup_form" class="btn btn-primary">Sign Up</button>
但是在脚本中你有
signup_form$("#signup_form").submit(function(e) {