Windows onload event not working with custom javascript structure

Question

My problem is that the jQuery load event is not working with my custom Javascript structure. I have tried many solutions to solve this problem but I failed.

var Init_Template = (function($) {
  "use strict";

  return {
    init: function() {
      this.plugins();
      this.menus();
    },
    plugins: function() {
      // Codes
    },
    menus: function() {
      $(window).on("load", function(e) {
        alert();
      });
    }
  };
})(jQuery);

// Load when ready
jQuery(document).ready(function() {
  function System_Init() {
    Init_Template.init();
  }

  if (window.self === window.top) {
    System_Init();
  } else {
    setTimeout(System_Init);
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Your code works fine, although note that it won't in the snippet as the `window.self === window.top` condition fails. — Rory McCrossan, Mar 25 '19 at 16:13
@Kognise no, they are [slightly different.](https://stackoverflow.com/questions/8396407/jquery-what-are-differences-between-document-ready-and-window-load) — Rory McCrossan, Mar 25 '19 at 16:14
@RoryMcCrossan Ah ok. thanks. Any chance the window load event and the ready event are racing in some way? — kognise, Mar 25 '19 at 16:15
@RoryMcCrossan Please take a look at 'menus' function there's an alert must be run after the page is loaded but that does not happen. — George, Mar 25 '19 at 16:17
I've seen it. It appears when you comment out the `window.self === window.top` condition: https://jsfiddle.net/0sn9cy81/ — Rory McCrossan, Mar 25 '19 at 16:18
@RoryMcCrossan I have do that but the alert still not run :( — George, Mar 25 '19 at 16:20
Then you need to debug why that condition is not working for you. The structure of your JS is not the problem. — Rory McCrossan, Mar 25 '19 at 16:20
@RoryMcCrossan in the demo link that you have added the alert still not run https://jsfiddle.net/0sn9cy81/ but if we do something like this https://jsfiddle.net/vc86u4bg/ it's working without any issues. — George, Mar 25 '19 at 16:22
setTimeout causes the code to run after the window.onload has fired. Remove the setTimeout call and call it directly and see it fire.... — epascarello, Mar 25 '19 at 16:23
@epascarello Same thing please check my previous comment to understand more. — George, Mar 25 '19 at 16:25
I understand fine.... setTimeout causes it to load after the window load is triggered.... nothing you can do about it... Makes no sense really why you are doing this pattern with the timeout. — epascarello, Mar 25 '19 at 16:26
@epascarello i understand you and i have do what you say but the alert still not run please check this demo https://jsfiddle.net/a3w0xn2u/ — George, Mar 25 '19 at 16:29
@epascarello I don't use any blocker and i have tried with another browser, But if you sure that the alert run in this link jsfiddle.net/a3w0xn2u so thank you for your time I will try to found a solution. — George, Mar 25 '19 at 16:35

score 0 · Answer 1 · answered Mar 25 '19 at 17:09

0

You will want that script with the jquery loading BEFORE you execute your javascript and jquery code so move the script tag above your code. I believe this will solve your issue for you.

answered Mar 25 '19 at 17:09

Al Katawazi

7,192
6
26
39

Windows onload event not working with custom javascript structure

1 Answers1