jQuery异步函数未等待返回值问题求助

问题根源 #

你遇到的执行顺序混乱，核心原因是IsValidEmail里的$.get是异步HTTP请求：

• 调用IsValidEmail(email)时，浏览器会立刻发请求，但不会等响应返回，函数直接返回一个jqXHR对象（不是你要的布尔值）
• 所以PostComment里的if判断会先执行，弹出提示框1
• 等邮件验证的请求拿到结果后，才会触发回调里的alert2和3

解决方案 #

方案1：用Promise + async/await（代码更清晰，推荐） #

修改IsValidEmail返回Promise，再在PostComment里用await等待验证结果：

function IsValidEmail(emailAddress) {
    return new Promise((resolve) => {
        $.get("https://isitarealemail.com/api/email/validate?email=" + emailAddress)
            .done(function(data) {
                alert(data.status);  // 步骤2
                const isValid = data.status === 'valid';
                if (isValid) alert("YES"); // 步骤3
                resolve(isValid);
            })
            .fail(() => resolve(false)); // 请求失败默认验证不通过
    });
}

async function PostComment(event) {
    event.preventDefault(); // 先阻止表单默认提交，避免页面跳转
    
    const name = $("#name").val();
    const email = $("#email").val();
    const message = $("#message").val();
    
    // 等待邮件验证结果返回
    const isValid = await IsValidEmail(email);
    
    if (!name || !email || !isValid || !message) {
        alert("Please check the name, email and message. Make sure your email address is valid"); // 步骤1
        $("#btnPostComment").prop('disabled', false);
        $("#preloader").hide();
        return;
    }
    
    // 验证通过，执行提交逻辑
    $("#btnPostComment").prop('disabled', true);
    $("#Posting").show();
    const url = "/BlogData/PostComment";
    const formData = new FormData();
    formData.append("Name", name);
    formData.append("Email", email);
    formData.append("Comment", message);
    formData.append("BlogId", @Model.Id);

    $.ajax({
        type: 'POST',
        url: url,
        data: formData,
        processData: false,
        contentType: false,
        cache: false,
        success: function (response) {
            $("#preloader").show();
            LoadPartialView(response.blogId);
            $("#formPostComment")[0].reset();
        },
        failure: function (response) {
            alert(response.responseText);
            $("#preloader").hide();
            $("#btnPostComment").prop('disabled', false);
        },
        error: function (response) {
            alert(response.responseText);
            $("#preloader").hide();
            $("#btnPostComment").prop('disabled', false);
        }
    });
}

同时修改表单，传递event参数：

<form id="formPostComment" method="post" onsubmit="PostComment(event)">

方案2：用回调函数（兼容旧浏览器） #

如果不想用Promise，给IsValidEmail加个回调，验证完成后再执行后续逻辑：

function IsValidEmail(emailAddress, callback) {
    $.get("https://isitarealemail.com/api/email/validate?email=" + emailAddress,
        function(data) {
            alert(data.status);  // 步骤2
            const isValid = data.status === 'valid';
            if (isValid) alert("YES"); // 步骤3
            callback(isValid);
        })
}

function PostComment(event) {
    event.preventDefault();
    
    const name = $("#name").val();
    const email = $("#email").val();
    const message = $("#message").val();
    
    // 先检查空值
    if (!name || !email || !message) {
        alert("Please check the name, email and message. Make sure your email address is valid");
        $("#btnPostComment").prop('disabled', false);
        $("#preloader").hide();
        return;
    }
    
    // 调用邮件验证，传入回调处理结果
    IsValidEmail(email, function(isValid) {
        if (!isValid) {
            alert("Please check the name, email and message. Make sure your email address is valid");
            $("#btnPostComment").prop('disabled', false);
            $("#preloader").hide();
            return;
        }
        
        // 验证通过，执行提交
        $("#btnPostComment").prop('disabled', true);
        $("#Posting").show();
        const url = "/BlogData/PostComment";
        const formData = new FormData();
        formData.append("Name", name);
        formData.append("Email", email);
        formData.append("Comment", message);
        formData.append("BlogId", @Model.Id);

        $.ajax({
            type: 'POST',
            url: url,
            data: formData,
            processData: false,
            contentType: false,
            cache: false,
            success: function (response) {
                $("#preloader").show();
                LoadPartialView(response.blogId);
                $("#formPostComment")[0].reset();
            },
            failure: function (response) {
                alert(response.responseText);
                $("#preloader").hide();
                $("#btnPostComment").prop('disabled', false);
            },
            error: function (response) {
                alert(response.responseText);
                $("#preloader").hide();
                $("#btnPostComment").prop('disabled', false);
            }
        });
    });
}

表单同样要传递event参数：

<form id="formPostComment" method="post" onsubmit="PostComment(event)">

重要提示 #

• 异步操作不能直接返回同步值，必须用Promise、回调或async/await处理结果
• 一定要先调用event.preventDefault()，避免表单默认提交导致页面跳转打断逻辑
• 记得处理请求失败的情况，防止页面卡住

内容的提问来源于stack exchange，提问作者nikhil