带有$ .getJSON的jQuery插件返回undefined？

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请求是异步的，所以在收到AJAX请求之前alert()正在运行，因此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 );
    }
});