Python Ajax将表单数据发送到flask后端的错误路由

我使用ajax和jquery将表单数据发送到后端。脚本应该读取来自表单的操作url，并将表单数据以与表单中的操作相同的url发布到后端（请参见下面的代码）。然而，当我填写登录表单时，数据似乎被发送到后端的注册方法，而此时它应该被发送到登录方法。填写并提交注册表表单将数据正确发送到后端的注册表方法。因此，我不明白为什么在提交登录表单时不调用log_in方法

Ajax和Jquery:

<script>

    $(document).ready(function () {

        $('form').submit(function (e) {
            $.ajax({
                type: "POST",
                url: $('form').attr('action'), // url to post to, from the forms action
                data: $('form').serialize(), 

                success: function (data) {
                    console.log(data)  

                }

            })
            e.preventDefault(); // block the traditional submission of the form.
        });


        // Inject our CSRF token into our AJAX request.
        $.ajaxSetup({
            beforeSend: function (xhr, settings) {
                if (!/^(GET|HEAD|OPTIONS|TRACE)$/i.test(settings.type) && !this.crossDomain) {
                    xhr.setRequestHeader("X-CSRFToken", "{{ form_login.csrf_token._value() }}")
                    xhr.setRequestHeader("X-CSRFToken", "{{ form_register.csrf_token._value() }}")
                }
            }
        })
    });
</script>

{% from "_formhelpers.html" import render_field %}

<div style=" border-style: solid; border-width: 5px; border-color: #FAF6EA">
    <form id="log_in_form" action="{{ url_for('users.log_in') }}">
        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
        <br>
        <label for="formGroupExampleInput">Returning Customer</label>
        <br>
        <div class="form-group">
            {{ render_field(form_login.email, type="email", class="form-control", id="email", placeholder="Email") }}
        </div>
        <div class="form-group">
            {{ render_field(form_login.password, type="password", class="form-control", id="password", placeholder="Password") }}
        </div>
        <button type="submit" class="btn btn-primary light-button" style="color: black">Submit</button>
        <div><br><br><br><br><br><br><br></div>

    </form>
</div>

{% from "_formhelpers.html" import render_field %}

<div style=" border-style: solid; border-width: 5px; border-color: #FAF6EA">
    <form id="sign_up_form" action="{{ url_for('users.register') }}">
        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
        <br>
        <label for="formGroupExampleInput">Sign up to gain access!</label>
        <br>
        <div class="form-row">
            <div class="form-group col-md-6">
                {{ render_field(form_register.first_name, type="text", class="form-control", id="first_name", placeholder="First Name") }}
            </div>
            <div class="form-group col-md-6">
                {{ render_field(form_register.last_name, type="text", class="form-control", id="last_name", placeholder="Last Name") }}
            </div>
        </div>
        <div class="form-group">
            {{ render_field(form_register.email, type="email", class="form-control", id="email", placeholder="Email") }}
        </div>
        <div class="form-group">
            {{ render_field(form_register.password, type="password", class="form-control", id="password", placeholder="Password") }}

        </div>
        <div class="form-group">
            <div class="form-check">
                <input class="form-check-input" type="checkbox" id="gridCheck" name="confirm_age" required>
                <label class="form-check-label" for="gridCheck">
                    I confirm that I am 19 years of age or older.
                </label>
            </div>
        </div>
        <div class="form-group">
            <div class="form-check">
                <input class="form-check-input" type="checkbox" id="gridCheck" name="policy" required>
                <label class="form-check-label" for="gridCheck">
                    I agree to the CanaXpress terms of service and privacy policy.
                </label>
            </div>
        </div>
        <button type="submit" class="btn btn-primary light-button" style="color: black">Submit</button>
    </form>
</div>

user_blueprint = Blueprint('users', __name__)


class RegisterUser(FlaskForm):
    first_name = StringField('first_name', validators=[InputRequired()])
    last_name = StringField('last_name', validators=[InputRequired()])
    email = StringField('email', validators=[InputRequired()])
    password = StringField('password', validators=[InputRequired()])


class LogInUser(FlaskForm):
    email = StringField('email', validators=[InputRequired()])
    password = StringField('password', validators=[InputRequired()])


@user_blueprint.route('/log_in', methods=['POST'])
def log_in():
    form = LogInUser(request.form)
    print("Log in method")

    if form.validate_on_submit():
        email = request.form['email']
        password = request.form['password']
        print("log in form validated")

        try:
            if User.is_login_valid(email, password):
                session['email'] = email
                print("User found and logged in")

        except UserErrors.UserError:          # as e:
            return jsonify(data=form.errors)  # return e.message

        return jsonify(data={'message': 'hello {}'.format(form.data.name)})  # form.data

    print("log in not validated")
    return jsonify(data=form.errors)


@user_blueprint.route('/register', methods=['POST'])
def register():
    form = RegisterUser(request.form)
    print("Signed up")
    if form.validate_on_submit():
        print("validated")

        return jsonify(data={'message': 'hello {}'.format(form.data)})  # form.data
    print("not validated")
    return jsonify(data=form.errors)

---

很抱歉，我放弃了所有这些代码，但不幸的是，我无法缩小问题的范围。我的总体目标是使用相同的脚本异步处理页面上的所有表单，如果您知道更好的方法，请与我们分享，因为这对我同样有帮助，谢谢

我猜您在同一页面上有两个表单，如果是这种情况，您在ajax调用中使用的$（'form'）将返回它找到的第一个表单，尤其是正在提交的表单

可以使用$（this）以当前活动元素为目标

$('form').submit(function (e) {
        $.ajax({
            type: "POST",
            url: $(this).attr('action'), // url to post to, from the forms action
            data: $(this).serialize(), 

            success: function (data) {
                console.log(data)  

            }

        })
        e.preventDefault(); // block the traditional submission of the form.
    });