5

I want to call a jQuery function from an HTML <body> tag. Here's my HTML:

< body bgcolor="#ffffff" onLoad="???" >

How would I call a jQuery function when the page is loaded? My jQuery function looks like this

jQuery(function($){
    var input_id;
    //code
});
Pang
  • 9,564
  • 146
  • 81
  • 122

6 Answers6

13

whatever code you write in the below method(block) would be executed automatically after the DOM load. You need not call this from HTML component again.

 $(document).ready(function() { 

//your code
});
sun_dare
  • 1,146
  • 2
  • 13
  • 33
  • 1
    @isherwood . OP is expecting that the method needs to be called from HTML which is not required. Check his question. < body bgcolor="#ffffff" onLoad="???" > . which I have addressed. Don't know why it is down voted? – sun_dare Jul 17 '14 at 20:46
  • so including this in the script of my html would cause it to automatically run when page loads? And is that all I have to do? do I need to include jQuery( like I did in my original question anywhere? –  Jul 17 '14 at 21:02
  • @user3822248 that is all you are supposed to do. jQuery is just an alternative to '$' sign. $ is short notation for jQuery – sun_dare Jul 17 '14 at 21:17
3

This topic has been covered here before.

You are most likely looking for

$(document).ready(function() { 
    var input_id;
    //code
})

Or

$(window).load(function($) {
    var input_id;
    //code
});

If you are curious about the difference between these two, see the JQuery documentation on the topic.

Also note that <body onload="">, which you seem to be trying to use, is generally not compatible with the above JQuery.

thele101
  • 241
  • 3
  • 4
2

HTML: You're on the right track, but you do not have to have put JS in the body tag. See the JS options below:

<body bgcolor="#ffffff">

JS

$(window).load(function($) {
    functionA(arg1, arg2, arg3);
});

This will fire up functionA() once the DOM including graphics have fully loaded.

OR

$(document).ready(function($) {
    functionA(arg1, arg2, arg3);
});

This will fire functionA() once the DOM has loaded and before any graphics finish loading.

PeterKA
  • 24,158
  • 5
  • 26
  • 48
2
$(function() {
    // code
});

This is shorthand for document.ready() so it will wait for the body to finish loading before executing.

Jeremy Moritz
  • 13,864
  • 7
  • 39
  • 43
0

As of Jquery 3, the following syntax is depreciated:

document.ready(function(){
   //code
});

The recommended alternative in Jquery 3 is to use the following syntax (which in previous versions was just considered a shorthand syntax):

$(function(){
    //code
});

Here is is the official Jquery explanation for why the first syntax was depreciated and is no longer recommended (https://api.jquery.com/ready/):

... The selection [of document] has no bearing on the behavior of the .ready() method, which is inefficient and can lead to incorrect assumptions about the method's behavior.

VKK
  • 882
  • 7
  • 19
-1
document.ready(function($){
  // here you go
})
Cute_Ninja
  • 4,742
  • 4
  • 39
  • 63