Doing something after jquery updates the DOM (AJAX request)
I have some livequery handlers which update the page content. I'd like to display the content only after they have fired (to prevent users seeing for a while the unchanged version). The content is loaded using normal AJAX.
So far I tried the following:
- get the ajax via html
- make it invisible (visibility: hidden)
- window.setTimeout(showContent, 100) - sets visibility to visible
I supposed this would work as there's a single JS thread for a single tab - so the timer should fire after all other operations finished. And it works in FF & IE. However in Chrome, sometimes I'm still seeing the unchanged content for a while - as if JS was threaded or interrupted by the timeout?
Or maybe there's a better way to achieve what I'm trying开发者_StackOverflow社区 to do? (Without the timeout).
- you can use the success callback
- or you can return the javascript itself back and add it to the dom. (in which you'll specify the display mechanisms :) )
It turns out that livequery uses a timeout internally do run the live queries, so it was a matter of timeout method ordering.
So I solved this waiting until the livequery queue clears (with some boundaries, if the user is crazy with his mouse and constantly produces events):
function run_after_livequery(method) {
var tries = 0;
function run_if_livequery_done() {
if (!$.livequery.queue.length || tries >= 20) {
method();
} else {
window.setTimeout(run_if_livequery_done, 50);
tries++;
}
}
window.setTimeout(run_if_livequery_done, 50);
}
精彩评论