8

在 $.getJSON 成功函数中，我首先触发另一个元素的点击事件：

$('#' + data[0].ID).trigger('click');

触发的点击事件有自己的 $.getJSON 方法将一堆数据加载到 div 中。触发事件后的下一行：

$.each(data[0].ListEntries, function (key, val) {
        //this relies on the triggered click event 
        //having completely loaded all data!
}

起初 $.each 似乎没有做任何事情，但我在触发事件后立即添加了一个警报。响应警报后，$.each 中的代码显示了它应该做什么。

我猜 $.each 在单击事件完成加载数据之前正在运行。

setTimeout 暂停足够长的时间让 click 事件加载数据，但我宁愿不设置任意时间：

setTimeout(function() { 
    $.each(data[0].ListEntries, function (key, val) {
        //this relies on the triggered click event 
        //having completely loaded all data!
    }
}, 1000);

我还尝试了 $.when 和 $.then 无济于事（尽管在 $.each 之前添加警报 $.then 会导致 $.each 工作延迟）：

$.when($('#' + data[0].ID).trigger('click')).then(function () {
    $.each(data[0].ListEntries, function (key, val) {
        //this relies on the triggered click event 
        //having completely loaded all data!
    })
4

3 回答 3

6

您可以为此使用自定义事件。您可以将您$.each放入事件的侦听器中，然后您的$.getJSON成功处理程序可以触发该事件：

$('#x').click(function() {
    var _this = this;
    $.getJSON(url, data, function(data) {
        // do things to data...
        _this.trigger('data-loaded');
    });
});
$('#x').on('data-loaded', function() {
    $.each(...)
});
$('#x').click();

演示：http: //jsfiddle.net/ambiguous/FeYTB/

于 2012-05-19T06:12:07.727 回答
6

整理得更清晰

.trigger()返回一个 jQuery 对象，因此您无法选择执行$.when() ... $.then().

另一方面，.triggerHandler(), 将返回您选择的对象，从而可以执行延迟的技巧。

您的代码分为三个功能，简化如下。调用路径是 1,2,3，最重要的返回路径是 3,2,1。

(1) 最高级别（JSON 成功）函数将包括以下几行：

function() {
    ...
    $.when($('#' + data[0].ID).triggerHandler('click')).done(function() {
        $.each(data[0].ListEntries, function (key, val) {
            ...
        });
    });
    ...
};

(2) (1) 触发的点击处理程序如下：

$("img.Button").on("click", function () {
    return GetModels(this.id);//here `return` passes on the jqXHR object, up the return path.
});

(3) 并且 (1) 所依赖的包含 JSON 的最低级别函数将具有以下一般形式：

function GetModels(id) {
    ...
    var jqXHR = getJSON(function(){...});
    ...
    return jqXHR;//it is vital to retutn the jqXHR object arising from the json call.
}

备注：

  • .when()返回路径将由 (3) 中的调用产生的 jqXHR 对象作为 (1) 中的方法的“承诺”参数传递.getJSON()。因此，(1) 中的链接.done()在触发作为其参数提供的函数之前被迫等待 jqXHR 被解析（即完成）。
  • 点击处理程序不假设它是如何被调用的。它只是返回 jqXHR 对象。因此，当使用 调用时.triggerHandler()，单击处理程序可以附加其他行为，而不会影响正常的单击操作。
  • It would be simpler to call GetModels() directly from (1), cutting out the middle-man (2), which is fine if GetModels() behaviour is uniquely wanted. If, however, (1) needs to be responsive to any future changes to the triggered click handler (2), then the above approach needs to be adopted.
于 2012-05-19T07:07:15.783 回答
0

你为什么不试试

$('#' + data[0].ID).live('click', function (){
   $.each(data[0].ListEntries, function (key, val) {
            // your stuff here 
    });
});

所以$.each只有在点击被触发后才会运行。

于 2012-05-19T05:46:58.753 回答