分类导航

程序问答发布时间：2022-06-02 发布网站：大佬教程 code.js-code.com

大佬教程收集整理的这篇文章主要介绍了添加 .done 函数后，jQuery AJAX 调用无需命令即可启动，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

如何解决添加 .done 函数后，jQuery AJAX 调用无需命令即可启动？

开发过程中遇到添加 .done 函数后，jQuery AJAX 调用无需命令即可启动的问题如何解决？下面主要结合日常开发的经验，给出你关于添加 .done 函数后，jQuery AJAX 调用无需命令即可启动的解决方法建议，希望对你解决添加 .done 函数后，jQuery AJAX 调用无需命令即可启动有所启发或帮助；

我正在重写一系列 jquery AJAX 请求，但遇到了 .done 代码块的问题。我正在尝试发送 AJAX 请求并在处理数据之前等待响应。作为指南，我一直在使用以下页面： http://michaelsoriano.com/working-with-jquerys-ajax-promises-and-deferred-objects/

我还查看了无数堆栈问题以尝试解决我的问题，但没有找到任何有帮助的内容。作为参考，我看过的一些问题如下：
jQuery Ajax call not processing .done
jquery ajax done function not firing
Confused on jquery .ajax .done() function

我注意到，当我创建与上述指南类似的代码块时，函数在页面加载时运行，而不是在代码中触发时运行。为了隔离故障，我创建了一个简单的示例，如下所示：

<!DOCTYPE HTML>
<HTML lang="en">

<body>
    <button type="button" onclick="getData()">Click me</button>
</body>

<script src="https://AJAX.GoogleAPIs.com/AJAX/libs/jquery/3.3.1/jquery.min.Js"></script>
<script>
//Commented out due comment below   
/*function getData() {
        console.log('enter getData');
        return $.AJAX({url:'./testAJAX.HTML',type:"POST"});
    }
     
    getData().done(function(data){
        console.log('enter done');
        alert(data);
    });*/

    function getData() {
        console.log('enter getData');
        $.AJAX({ url: './testAJAX.HTML',type: "POST" })
            .done(function (data) {
                console.log('enter done');
                alert(data);
            });
        alert('after');
    }
</script>

</HTML>

我原以为当我的示例页面加载时，什么也不会发生，因为除非单击按钮，否则不会触发执行 getData() 函数。但是，当我加载页面时，我的控制台会记录“输入 getData”然后“输入完成”，然后我会收到带有 ./testAJAX.HTML 页面内容的警报（只是一个字符串）。此外，当我然后单击按钮时，它进入 getData() 但不触发 getData().done 函数，因此没有收到警报。

有没有人能在这里指导我走上正确的道路，帮助我阻止 getData() 函数在页面加载时执行，而是让按钮点击执行 AJAX 请求，等待结果，然后执行.done 块中的代码？

解决方法

您拥有的 getData() 表达式会在页面加载时立即调用该函数。然后将一个 .done 处理程序附加到它。

听起来您想要一个调用 $.ajax 并且将 .done 附加到它的函数，例如：

function getData() {
    console.log('enter getData');
    $.ajax({ url: './testajax.html',type: "POST" })
        .done(function (data) {
            console.log('enter done');
            alert(data);
        });
}

然后将 getData 作为事件处理程序附加到某处。

Don't use inline handlers。改用 .addEventListener 或 jQuery 的 .on('click'。