jquery ajax 获取 HTML 但不会返回它

jquery ajax gets HTML but will not return it

本文关键字：返回 ajax 获取 HTML jquery      更新时间：2023-09-26

可能的重复项：
如何从函数返回 AJAX 调用的响应？

我正在尝试通过ajax获取一些HTML内容。但是出于某种原因，尽管 HTML 使其进入 ajax 函数，但当我尝试将其用作返回值时，我得到了undefined.

喜欢这个：

function get_additional_options(name) {
    var post = $.ajax({
            type: 'post',
            url: 'order_queries_templates/html/' + name + '_additional_options.php?<?=time()?>',
            //data:'product_id=' + product_id,
            dataType: 'html'
            });
    post.done(function (p) {
        console.log(p); //prints out all the HTML just as I would expect
        return p;
    });
}

但是当我尝试让 HTML 像这样将其附加到我的页面时

if (has_additional_options == "t"){
    var html_to_append = get_additional_options(name);
    console.log(html_to_append); // undefined
}

如果我使用 done() 方法，或者只是将值作为成功回调返回，则结果相同。我的错误是什么？

不能从异步调用的函数返回值。

您应该返回 post（即 $.ajax 的结果），然后在函数外部注册一个.done处理程序：

function get_additional_options(name) {
    return $.ajax({
        ...
    });
};
if (has_additional_options == "t") {
     get_additional_options(name).done(function(p) {
         console.log(p);
     });
     // NB: code execution continues here immediately - don't do anything
     //     else here - all further stuff must be done in the above callback
 }

您将在匿名函数中返回 HTML 值。你基本上是把它传递给post.done方法。

也许在这种情况下使用事件会更好，因为您在此处运行异步代码。

function get_additional_options(name) {
    var post = $.ajax({
            type: 'post',
            url: 'order_queries_templates/html/' + name + '_additional_options.php?<?=time()?>',
            //data:'product_id=' + product_id,
            dataType: 'html'
            });
    post.done(function (p) {
        $("body").trigger("html_loaded",[p]);
    );
}
$("body").on("html_loaded", function (htmlData) {
    // Do something with your HTML data here.
    $(this).append(htmlData);
});
相关文章：