如何将数据返回到Javascript中的原始调用函数？

问题描述 投票：2回答：5

我在将数据返回到想要返回的函数时遇到问题。下面的代码：

function ioServer(request_data, callback)
{
    $.ajax({
        cache: false,
        data: "request=" + request_data,
        dataType: "json",
        error: function(XMLHttpRequest, textStatus, errorThrown){},
        success: function(response_data, textStatus){
            callback(response_data);
            },
        timeout: 5000,
        type: "POST",
        url: "/portal/index.php/async"
    });
}   

function processRequest(command, item, properties)
{
    var request = {};
    request.command = command;
    request.item = item;
    request.properties = properties;
    var toServer = JSON.stringify(request); 
    var id = ioServer(toServer, processResponse);
    return id;
}

function processResponse(fromServer)
{
    if (fromServer.response == 1)
    {
        return fromServer.id;   
    }   
}

我通过在另一个函数内调用processRequest函数来调用这段代码。发送请求并获取响应就可以了。但是，我需要将响应中的值“ id”返回给processRequest函数，因此它又可以将该值返回给其调用方。据我所知，processResponse中的返回值返回到$ .ajax，但是我需要它进一步返回到processRequest。

顺便说一句，processResponse中的if语句引用服务器端PHP脚本设置的值，以告知是否允许该请求（例如，如果用户未登录，fromServer.response将为0）。它与$ .ajax对象的成功/错误例程无关。

非常感谢您的帮助。

@@ Jani：感谢您的答复，但您能否再说明一点？需要'id'的函数具有以下代码：

$(#tabs).tabs('add', '#tab-' + id, 'New tab');

您是说我应该尝试在processResponse函数中执行这段代码吗？因为那不是我打算做的。这些功能旨在成为维护状态服务器端的通用解决方案。这就是为什么我避免在此处放置这段代码的原因。

javascript jquery ajax callback return
5个回答
3
投票

由于Tony没有提供任何评论，所以让我添加有关他的建议的详细信息。

正如您所了解的，由于$ .ajax方法是异步的，因此在进行$ .ajax调用后，processRequest函数将立即完成。那么，您将如何通知processRequest的调用者该任务已完成？

[简单，您要求processRequest的调用者提供“回调函数”。每当processRequest收到ajax输出时，它将调用此函数。在tony的代码中，这是processRequest函数的最后一个参数。

所以您的呼叫代码现在看起来像

function tabMethod() {
    processRequest('command', 'item', 'properties',
        function (id) {
            if (id == null) {
                alert('There is a problem!');
                return;
            }
            $('#tabs').tabs('add', '#tab-' + id, 'New tab');
        });
};
5
投票

我认为这可能更接近您想要的...

function ioServer(request_data, callback)
{
    $.ajax({
        cache: false,
        data: "request=" + request_data,
        dataType: "json",
        error: function(XMLHttpRequest, textStatus, errorThrown){},
        success: function(response_data, textStatus){
                processResponse(response_data, callback);
                },
        timeout: 5000,
        type: "POST",
        url: "/portal/index.php/async"
    });
}   

function processRequest(command, item, properties, callback)
{
    var request = {};
    request.command = command;
    request.item = item;
    request.properties = properties;
    var toServer = JSON.stringify(request); 
    ioServer(toServer, callback);
}

//internal callback to handle response code
function processResponse(fromServer, callback)
{
    if (fromServer.response == 1)
    {
        //call the callback with the id
        callback(fromServer.id);   
    }   
    else
    {
        //You have to remember to call the callback no matter what
        //or the caller won't know when it's complete
        callback(null);  //or some other "didn't get a valid response" value
    } 
}
3
投票

因为这是一个异步请求，所以它不会直接返回这样的值，并且不可能。

解决此问题的方法是，采用某种方法对获取的数据执行所需的任何操作，而不是尝试使用不起作用的返回值。

1
投票

很棒！谢谢大家的帮助，它现在就像一种魅力。而且我学会了更好地使用回调。这是完整的工作代码：

createTab('#tabs'); // I'm using JQuery UI to handle tabs    

function createTab(parent_element){
            var name = {};
            name.name = "New tab";
            var position = {};
            position.position = $(parent_element).tabs('length') + 1;
            var properties = new Array();
            properties[0] = name;
            properties[1] = position;
            processRequest(1, 1, properties, 
                      function(id)
                      {
                         if(id == null) 
                         {
                              alert('There is a problem!');
                              return;
                         }
                         $('#tabs').tabs('add', '#tab-' + id, 'New tab');
                      });
        }

function ioServer(request_data, callback)
{
    $.ajax({
        cache: false,
        data: "request=" + request_data,
        dataType: "json",
        error: function(XMLHttpRequest, textStatus, errorThrown){},
        success: function(response_data, textStatus){
                processResponse(response_data, callback);
                },
        timeout: 5000,
        type: "POST",
        url: "/portal/index.php/async"
    });
}   

function processRequest(command, item, properties, callback)
{
    var request = {};
    request.command = command;
    request.item = item;
    request.properties = properties;
    var toServer = JSON.stringify(request); 
    ioServer(toServer, callback);
}

//internal callback to handle response code
function processResponse(fromServer, callback)
{
    if (fromServer.response == 1)
    {
        //call the callback with the id
        callback(fromServer.id);   
    }   
    else
    {
        //You have to remember to call the callback no matter what
        //or the caller won't know when it's complete
        callback(null);  //or some other "didn't get a valid response" value
    } 
}

并且它将在页面列表的末尾添加一个新标签。现在，它也存储在PHP和MySQL的服务器端，就像我想要的一样。

再次感谢！

0
投票

不是像以前发布的其他人那样实现阻塞来模拟同步调用，只需使AJAX调用本身同步并更新您的成功包装器：

function ioServer(request_data, callback) {
    var response = null;
    $.ajax({
        cache: false,
        data: "request=" + request_data,
        dataType: "json",
        error: function(XMLHttpRequest, textStatus, errorThrown){},
        success: function(response_data, textStatus) {
                response = callback(response_data);
        },
        timeout: 5000,
        type: "POST",
        url: "/portal/index.php/async",
        async: false
    });

    return response;
}

编辑：虽然有用，但是这与“正常” AJAX使用的本质有所抵触。我建议改为更改您的方法。

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.