Recharger dynamiquement les éléments et lire leurs nouveaux attributs dans JQuery

Question

J'ai un appel Ajax qui retourne un morceau de code html qui est censé remplacer le vieux code html sur la page, en leur donnant de nouveaux attributs. Une fois que j'ai réussi à modifier dynamiquement mes éléments, je souhaite exécuter un autre morceau de code JS qui lit et utilise certains des attributs des éléments rechargés dynamiquement. Cependant, JS préfère lire les anciennes données (comme si elles s'exécutaient de manière synchrone).

La seule solution de contournement que j'ai trouvée est de régler une minuterie, mais le temps de retard de la minuterie doit être relativement élevé (300 ms) pour garantir que tout est toujours fait correctement. Quel est le bon moyen de le faire?

Voici un pseudo-code pour ce que j'ai en ce moment. Cela fonctionne mais le délai de 300ms est terrible.

$.post("ajax/test.html", function(newCode) { 
    $("#myDynamicDiv").html(newCode); 
    setTimeout(function(){ 
     //Use the data that was just stored in #myDynamicDiv 
    },300); 
}); 

Answer 1

Pour moi, je l'utilise .promise().done() peut-être que ça va marcher avec vous

$("#myDynamicDiv").html(newCode).promise().done(function(){ 
    // your code here 
}); 

Modifier: Pour quelqu'un qui va vient ici plus tard ..While mon code ne fonctionne pas avec Mohasen il a trouvé lui-même une solution .. Please find his answer below

Answer 2

J'ai accepté la réponse de Mohamed-Yousef, mais comme je n'ai pas inclus la réponse complète, voici la version complète de ce que j'ai finalement fait:

Un appel AJAX JQuery renvoie toujours un objet "Différé" lorsqu'il est appelé. Vous pouvez utiliser la méthode "then()" de cet objet pour exécuter les choses après la fin de l'appel ajax. Voici le code:

dfrd = $.post("ajax/test.html", function(newCode) { 
    $("#myDynamicDiv").html(newCode); 
}); 

dfrd.then(function(){ 
    //Anything that is here is guaranteed to happen after the Ajax call is done. 
});