从ajax添加节点后如何知道DOM何时再次准备就绪

时间:2011-10-10 12:42:42

标签: javascript jquery dom

我通过ajax收到一个JSON-File并将其添加到我的DOM中(参见: how to read information of an ajax-dialogbox

现在我想访问这个DOM节点,但它唯一的工作方式是:

get_ajax_dialogwindow();
alert("wait for click");
alert("Test Combo" + combobox_by_name(value.ID_of_name));

这完全正常,但我不希望用户先点击。如果我只尝试

get_ajax_dialogwindow();
alert("Test Combo" + combobox_by_name(value.ID_of_name));

我只得到数据应该是空的空间......我想这是因为DOM还没准备好。我尝试了$(document).ready,setTimeout,.delay(),ajax.stop,DOMContentReady,但唯一有效的是一个简单的警报(“等待”);但我不能忍受这个解决方案,因为我不希望用户点击20次:P

任何想法?

谢谢! :)

编辑:

这是代码:

function combobox_by_name(ID_of_name){
  return $('select[name=audience\\[' + ID_of_name + '\\]\\[value\\]] option:selected').text();
}

和我在警告之前做的ajax调用,插入了HTML节点:

function get_ajax_dialogwindow(){
var data = '__a=1&__d=1&__user='+get_userID();                              //Parameter für den Ajax Aufruf. Bestehend aus __a=1, __d=1 und der UserID
var json;
$.ajax({
    type:"GET",
    url: get_ajax_url(),                                                    //url für empfänger des Ajax Aufrufs. Lässt sich mit Firebug herausfinden, wenn man den link der das Dialogfenster öffnet analysiert
    data: data,
    dataType: "text",                                                       //eigentlich ist es json und kein text, allerdings gibt es einen Schutz von Facebook, 
                                                                            //der die Dauerschleife for(;;;) vorne heranschiebt. Deshalb wird es als Text betrachtet
    success: function(response) {           
        response = response.replace(/.*?;{/, "{");                          //Entfernt for(;;;)
        jsonFile = JSON.parse(response);                                    //Parsed den Text in ein Json file                   
        $('#globalContainer').append(jsonFile.payload.body.__html);         //Fügt das Dialogfenster ganz unten an die Seite hinzu
    },

    error: function(xhr) {                                                  //Fehlermeldung, falls der Ajax aufruf fehlschlägt
        alert('Error!  Status = ' + xhr.status);
        alert(xhr.responseText);
    }


});

}

2 个答案:

答案 0 :(得分:1)

使用回调函数。

function get_ajax_dialogwindow( CALLBACK ){
var data = '__a=1&__d=1&__user='+get_userID();                              //Parameter für den Ajax Aufruf. Bestehend aus __a=1, __d=1 und der UserID
var json;
$.ajax({
    type:"GET",
    url: get_ajax_url(),                                                    //url für empfänger des Ajax Aufrufs. Lässt sich mit Firebug herausfinden, wenn man den link der das Dialogfenster öffnet analysiert
    data: data,
    dataType: "text",                                                       //eigentlich ist es json und kein text, allerdings gibt es einen Schutz von Facebook, 
                                                                            //der die Dauerschleife for(;;;) vorne heranschiebt. Deshalb wird es als Text betrachtet
    success: function(response) {           
        response = response.replace(/.*?;{/, "{");                          //Entfernt for(;;;)
        jsonFile = JSON.parse(response);                                    //Parsed den Text in ein Json file                   
        $('#globalContainer').append(jsonFile.payload.body.__html);         //Fügt das Dialogfenster ganz unten an die Seite hinzu
        if ( CALLBACK ) CALLBACK();
    },

    error: function(xhr) {                                                  //Fehlermeldung, falls der Ajax aufruf fehlschlägt
        alert('Error!  Status = ' + xhr.status);
        alert(xhr.responseText);
    }


});

}

然后:

get_ajax_dialogwindow(function(){
   alert("Test Combo" + combobox_by_name(value.ID_of_name));
});

答案 1 :(得分:0)

我很确定这是因为异步ajax调用。您正在尝试访问尚未设置的变量。

如果您在实际访问之前发出警报,则需要一些时间才能单击“确定”按钮,因此呼叫正在完成。当代码转到下一行时,它按预期工作,因为该值已设置。

你在你的coallback函数中设置变量/用它做一些事情。由于您没有发布任何实际代码,我会即兴发布:

var yourVar;
$.get("someurl", params, function (data) {
  yourVar = data; // Let's say that you set it right here
  alert(yourVar); // will work perfectly
});
alert(yourVar); // Possibly won't work because it will most likely be called before the get is completed
编辑:我在您发布代码之前写完了这个答案。看来情况确实如此,但我会更深入地研究确认。

success: function(response) {           
    response = response.replace(/.*?;{/, "{");                          //Entfernt for(;;;)
    jsonFile = JSON.parse(response);                                    //Parsed den Text in ein Json file                   
    $('#globalContainer').append(jsonFile.payload.body.__html);         //Fügt das Dialogfenster ganz unten an die Seite hinzu
    // Here it should work
    alert("Test Combo" + combobox_by_name(value.ID_of_name));
},

您还可以查看getJSON方法,因为它是一种速记,我认为您会发现它对您的情况有用。它返回实际的JSON数据,因此您不需要进行任何黑魔法解析。