Window.onload Not Working On Page Being Loaded Into Base Page
So there is an index.html page, and a navbar.html page. navbar.html gets loaded into the index.html page
$(".include-nav-bar").load("share/navbar.html");
window.onload works fine on the base page (index.html), but, randomly works on the loaded in page (Note, I don't have onload on the base page, I only have onload on the navbar.html page)
The onload inside the navbar page randomly works after maybe the 3rd reload, I suspect its because the base page is overriding it or something.
Is there a way to get that second onload to work inside the loaded Index page? (Correctly any way, and not randomly)
Answer
Try $( document ).ready()
function.
Code included inside $( document ).ready() will only run once the page Document Object Model (DOM) is ready for JavaScript code to execute. Code included inside $( window ).on( "load", function() { ... }) will run once the entire page (images or iframes), not just the DOM, is ready.
Here is the documentation. https://learn.jquery.com/using-jquery-core/document-ready/
Related Questions
- → How to update data attribute on Ajax complete
- → October CMS - Radio Button Ajax Click Twice in a Row Causes Content to disappear
- → Octobercms Component Unique id (Twig & Javascript)
- → Passing a JS var from AJAX response to Twig
- → Laravel {!! Form::open() !!} doesn't work within AngularJS
- → DropzoneJS & Laravel - Output form validation errors
- → Import statement and Babel
- → Uncaught TypeError: Cannot read property '__SECRET_DOM_DO_NOT_USE_OR_YOU_WILL_BE_FIRED' of undefined
- → React-router: Passing props to children
- → ListView.DataSource looping data for React Native
- → Can't test submit handler in React component
- → React + Flux - How to avoid global variable
- → Webpack, React & Babel, not rendering DOM