JavaScript Call Funtion After Page Load

Usually we call a function during page on load with following two methods.

<body onload="happycode() ;">

or

<script>
window.onload=happycode ;
</script>

But how can we call a JavaScript function after page is loaded?. I solved it by using a very simple method, it did exactly what i want and call after page and content is loaded.

Just add an onload function at the end of the body. :)

<html>
<script language='javascript'>
function happycode(){
   alert('helo');
}
</script>
<body> 
<h1>Javascript call after page loaded</h1>
 
<script>
//call after page loaded
window.onload=happycode ; 
</script>
</body>
</html
Tags :

About the Author

mkyong
Founder of Mkyong.com and HostingCompass.com, love Java and open source stuff. Follow him on Twitter, or befriend him on Facebook or Google Plus. If you like my tutorials, consider make a donation to these charities.

Comments

  • http://2013happydiwali.in Harmeen Kaur Pannu

    Hi, there can you make javascript to disable Ctrl+U button my blog. I don’t want visitors to see focus keywords on my blog. People are copying keywords… please reply asap

  • http://mybloggingdiary.com Singh

    Woah.. thanks bro. You solved my problem. Nice Work. Can you please send JavaScript to me in email to disable copy on my blog.? Waiting for your reply

  • http://a Suresh

    This code is not working in asp.netMvc4 .
    before loading its working not working after loading..

  • Farid Wong

    Loads of Thanks to mkyong!

  • http://sonusindhu.com sonu sindhu

    thanks so much …

  • http://www.gibwork.com Jonathan

    I have a javascript which I would like to activate automatically when loading my facebook group.

    The code works fine if I go to my group on facebook and add it as a bookmark containing the javascript as its url.

    I want to know how I can place on my website http://www.gibwork.com/gibworkadd with a hyperlink “click here” which takes them to my facebook group page and later activate the javascript?

    Some members are not browser savvy and take ages trying the method of creating a bookmark and making sure they click it whilst on the groups page or simply adding the javascript in the address bar. Just want it to be as automated as possible and have it as easy as clicking on a link on my page. This also works a charm in firefox so would be great if the code includes to use firefox. The perfect scenario would be not to have it restricted to firefox.

    I would state before clicking to download firefox if not already done so, but that is for me to worry with copy on the page. One thing to note is that i would like to have the javascript delay for a few seconds so it gives my group page time to load because they may have a slow internet connection.

    this is my javascript

    javascript:(function(){document.body.appendChild(document.createElement(‘script’)).src=’http://gibwork.com/Gibwork.js';})();

  • OMGWEEGEE2

    Danka, now I can be able to add the print function to one of my webpages so it automatically shows the printing prompt and let’s the user print out a christmas card I can create!

  • Aun Rizvi

    are you sure it is a standard way to do this? some browsers put the script inside the body automatically and when you get body.innerHTML you will also get the script tag !! refer this http://stackoverflow.com/questions/3037725/is-it-wrong-to-place-the-script-tag-after-the-body-tag

    • http://www.mkyong.com mkyong

      I didn’t say this is a standard way :) I’m using it and it works well.

      • http://www.thejobresults.com Peter Pandey

        Hi Yong Mook Kim
        This is very nice post, I am beginner in JavaScript so I know only you can solve my problem.
        My some of java script taking time to load.

        <script type="text/javascript">
        Content1
        </script>

        <script type="text/javascript">
        Content2
        </script>

        Please convert it to load after all page content load java script.

        Thanks in advance.

        • http://www.topixmenia.com Peter Pandey

          Sir Please reply….

  • http://www.gureller.org Tarik

    That is works. Thx. Additionally if u call more than one function you can use :

    window.onload = function () {
    func1();
    func2();
    etc.
    };

    on that style.

  • Aylian

    thnx bro u save my valubl time, keep this good work.tc bs.

  • Aara

    Thanks a lot !!

  • Hunter

    Works well if you only need the page to load; however, it will still execute before other elements are loaded (ie images).

  • http://mymobitricks.com sgor

    Thatz great man.. now am loadimg my cpm advertise link with page load

  • shimray

    works pretty fine. thanks!

  • Gardhi

    Great code. I spent couple of hours to find it. That is what I need.

  • K L Abhilash

    Hi this worked fineeeeee.

  • Luis Santos

    Thanks a lot this helped me…

  • ibrar

    Excellent idea :)
    thanks

  • Harish

    Simple and Brilliant. As they say “Hit the nail on its head”.

    Good that I found this tip before I pluck my hair :-)

    Thanks

    Harish

  • ashish

    So simple,Thanks

  • Viet

    same look it not work with external javescript function

  • Rams

    Thanks a lot..! A very handy and useful tip.

  • http://sample Tausif,Vinita

    Thanks, you did a great job.

  • sokolah974

    Great that did the trick. As mkyong wrote, we sometimes think too much !!!
    Thanks.

  • Matt

    There are many better ways of doing this. You can load your site even more faster by loading JavaScript files and references after content

    http://www.tutkiun.com/2010/07/load-javascript-after-pageload.html

  • http://allhits955.com Asa

    Brilliant! Thanks Mkyong!

    I work for a company that only allows me to edit blocks and won’t give me access to the website layout. I just installed a rotating image function in my block and your code activated it!

  • Neeraj

    No need to set window.onload function at the end of page…

  • http://www.computingunleashed.com/ Amal Roy

    Thanks a lot friend.

  • http://www.qualityposts.com/ForumPostingService.php ForumPoster

    Great, this would be handy if we could call out external javacript like this.

    For instance instead of putting this in our head (or at the bottom of the page):

    call this external sript from an onLoad.. but how?
    How can I call that external scipt only to be called/loaded after the page has loaeded?

  • mkyong

    article updated with full code provided. The “happycode” is a normal javascript function, the point is call this function at the end of the body.

    • Nil

      Hi,
      I am loading google chart. I want to call Javacript Print event after chart is loaded.
      Please hekp me thanks.

  • Kumar

    Please show me some sample code (more than shown above):

    ….

    //call after page loaded
    window.onload=happycode ;

    Where and how to define happycode? also where do you call
    window.onload=happycode?

  • Heiner

    wwwwwiiiiii! thanks! exactly what i need!

  • http://elbandito.us elbandito

    Very simple – thanks

    • mkyong

      ya sometime it’s just we think too much

      • Koray Tugay

        Did you reply to this comment because of the avatar?

        • kri

          Don’t you know he was donkey ?