0

I have some code in document.ready that fires, however it is firing too fast. It depends on some JavaScript creation or something first otherwise I get an ill effect.

What I have done is put the code I want to run last in a setTimeout-Zero which basically pushes it's delegate to run last. This works fine.

Is there a better approach in order to get around this timing issue and ensure my code runs later? I am solving an issue that is only in IE.

$(document).ready(function() { 
        window.setTimeout(function() {
            $('#accordionmain').trigger('click');
        //$('#accordionmain').trigger('click');
    }, 0);
Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
user1060500
  • 1,505
  • 1
  • 21
  • 40
  • if it ain't broke don't fix it.... – nathan hayfield Jul 16 '13 at 21:10
  • Not broke, however I am implementing this as a new fix, so I want to make sure I am using a best practice before implementing setTimeout in document ready all over the place... – user1060500 Jul 16 '13 at 21:11
  • what code has to fire before it will work? – nathan hayfield Jul 16 '13 at 21:12
  • What about just fixing the code so that there is no race condition anymore? – Jon Jul 16 '13 at 21:13
  • So you messed up code inclusion somehow, and now you're trying to fix it with timeouts, seems like a good idea ? – adeneo Jul 16 '13 at 21:15
  • Most likely you are populating the accordion with ajax, therefore, you'll need to trigger the click after said ajax is complete. That would be the best way of doing it. You don't need document ready in that case. – Kevin B Jul 16 '13 at 21:19
  • @adeneo - Messed up code inclusion? Don't judge. I didn't write the code, nor do I want to play the blame game. – user1060500 Jul 16 '13 at 21:22
  • I think @KevinB is right, your click trigger probably belongs at the end of whatever js creation you are doing, not in the doc.ready() which is only saying the html n stuff finished loading. Just because the document is ready, doesn't mean you are :) – Robert Hoffmann Jul 16 '13 at 21:24
  • @Robert - so what you're saying is that it should be placed at the bottom of the script file, outside document ready ? – adeneo Jul 16 '13 at 21:30
  • It works if it's outside the document.ready and just within a script tag. It seems like a sketchy approach though as I am concerned it might run "too soon" in some browsers... maybe I need to research the timings of this though – user1060500 Jul 16 '13 at 21:44
  • Probably, but not sure. He said it depends on some JS creation ..if he can pinpoint "that" creation, it would come, well ..just after that. Maybe that creation calls a trigger/triggerHandler, if so he could piggyback on that too. – Robert Hoffmann Jul 16 '13 at 21:44
  • There are complex 3rd party JavaScript libraries involved that are doing the creation. I haven't seen a way to inject a function delegate to get called back when the init/creation is completed. – user1060500 Jul 16 '13 at 21:46
  • Check this out ..maybe it can help http://stackoverflow.com/questions/2844565/is-there-a-jquery-dom-change-listener – Robert Hoffmann Jul 16 '13 at 21:48

1 Answers1

3

You could trigger your ready slightly differently

Instead of $(document).ready();

$(document).on('imReady', function() { 
    $('#accordionmain').trigger('click');
    // ..other stuff
});

Now in your code, do whatever you need and when you feel ready, just call

$(document).triggerHandler("imReady");

Of course if you know when you are done, you could just as well call $('#accordionmain').trigger('click'); directly

I use this kind of stuff all the time, cause i have a global document ready, but then i need do some setups, call a bunch of other stuff, and then in the end trigger a kind of finalize() ready function saying that the UI is now finally ready to be used by the end-user.

Robert Hoffmann
  • 2,366
  • 19
  • 29
  • I like the custom event idea, but only if he has control over that other javascript he is depending on, in order to trigger it. – Michael Jul 16 '13 at 21:48