0

I have several inline <script> tags that appear in the middle of my HTML document. These all require Jquery, and a couple need JQuery UI.

JQuery and JQuery UI are linked at the bottom of the document.

How can I have the inline scripts run after JQuery and UI are ready.

I have tried wrapping the inline scripts with this with no success:

$(window).load(function() {
//
 });

And I have also tried darbio's answer here using:

function defer(method) {
    if (window.jQuery)
        method();
    else
        setTimeout(function() { defer(method) }, 50);
}
defer(function () {
    alert("jQuery is now loaded");
});

But this didn't seem to work either?

Community
  • 1
  • 1
user500665
  • 1,220
  • 1
  • 12
  • 38
  • 3
    If you have scripts in the middle of the HTML that use jQuery, you should load it at the top, not at the bottom. – Barmar Nov 01 '16 at 10:23
  • Why do you need the scripts to be in the middle of the HTML document? Put them at the bottom, after loading jQuery. – Barmar Nov 01 '16 at 10:25
  • `$(window).load(function() ...)` requires jQuery. You can't use it before jQuery is loaded. – Barmar Nov 01 '16 at 10:26
  • BTW, `$(window).load()` is deprecated, you should use `$(window).on("load", ...)` – Barmar Nov 01 '16 at 10:27

1 Answers1

0

you should load jQuery and jquery-ui in your header if you want to run jQuery inside the DOM,

alternatively you could add window.onload() to all your script to prevent running it before the DOM is ready

src: onload

Kevin Kloet
  • 1,086
  • 1
  • 11
  • 21