带有 $.getJSON 的 jQuery 插件返回未定义？

Question

在我制作的 jQuery 插件内部：

$.getJSON(base_url,{
    agenda_id:defaults.id,
    action:defaults.action+defaults.type,
    output:defaults.output
},function(json){
    return json;
});

在一个单独的 JS 文件中（是​​的，它在插件之后）：

json = $('#agenda-live-preview').agenda({action:'get',type:'agenda',output:'json'});
alert(json[0].agenda_id);

如果我执行上述 $.getJSON 并在 $.getJSON 中放置一个警报，它会起作用并返回“3”，这是正确的。如果我像 json=$('#agenda-live-preview').agenda(...)... 那样做，它会返回 undefined。

我的 JSON 是有效的，并且 json[0].agenda_id 也是正确的，我知道它在回调中，那么如何在函数返回中获取回调中的内容？

Answer 1

因为 AJAX 请求默认是异步的，alert() 在收到 AJAX 请求之前就已经运行，因此 json 变量没有被赋值。

您想要的任何功能（例如警报）都需要在 AJAX 请求的回调中，或者需要在从回调中调用的函数中，或者可能使用 .ajaxSuccess() 调用。

或者您可以将函数作为参数传递给您的插件，并让$.getJSON() 回调调用它。

---

编辑：

在$.getJSON() 请求成功时传递回调以运行的示例：

$.fn.agenda = function(opts) {

    var defaults = {...} // your defaults

    $.extend(defaults, opts); // Extend your defaults with the opts received

    $.getJSON(base_url,{
        agenda_id:defaults.id,
        action:defaults.action+defaults.type,
        output:defaults.output
    },function(json){
        defaults.success.call(this,json);  // Call the 'success' method passing in the json received
    });
};

$('#agenda-live-preview').agenda({
    action:'get',
    type:'agenda',
    output:'json',
    success:function(data) {  // Pass a function to the plugin's 'success' property
        alert(data[0].agenda_id);
        alert( $(this).selector );
    }
});