# Need help adding $(document).ready(function(){

**URL:** <https://forum.kirupa.com/t/need-help-adding-document-ready-function/260913>\
**Category:** Uncategorized\
**Created:** [May 21, 2008, 12:55am UTC](https://forum.kirupa.com/t/need-help-adding-document-ready-function/260913 "2008-05-21T00:55:58Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![somnamblst](https://avatars.discourse-cdn.com/v4/letter/s/a4c791/32.png) [@somnamblst](https://forum.kirupa.com/u/somnamblst)\
**Post date:** [May 21, 2008, 12:55am UTC](https://forum.kirupa.com/t/need-help-adding-document-ready-function/260913/1 "2008-05-21T00:55:58Z")

</div>

This is the only jquery function I’ve run across that doesn’t begin with

```auto
$(document).ready(function(){
   // Your code here
 });

```

I am running into problems with my script trying to access jquery before the page is ready. I’m getting errors when I add it.

```auto
function tab_change( parent, elm )
  {
   $('#'+parent+' .show').slideUp('fast', function(){ $('#'+elm).slideDown('normal').addClass('show'); }).removeClass('show').addClass('hide');
  }

```

---

<div class="post-metadata">

**Author:** ![McGuffin](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/mcguffin/32/408_2.png) [@McGuffin](https://forum.kirupa.com/u/McGuffin)\
**Post date:** [May 21, 2008, 1:39am UTC](https://forum.kirupa.com/t/need-help-adding-document-ready-function/260913/2 "2008-05-21T01:39:42Z")

</div>

jQuery won’t work when it’s not loaded… you need to, at least, call all of your jQuery code from $(document).ready();

[http://docs.jquery.com/Tutorials:Introducing\_%24(document).ready()](http://docs.jquery.com/Tutorials:Introducing_%24%28document%29.ready%28%29)

---

<div class="post-metadata">

**Author:** ![somnamblst](https://avatars.discourse-cdn.com/v4/letter/s/a4c791/32.png) [@somnamblst](https://forum.kirupa.com/u/somnamblst)\
**Post date:** [May 21, 2008, 2:00am UTC](https://forum.kirupa.com/t/need-help-adding-document-ready-function/260913/3 "2008-05-21T02:00:34Z")

</div>

[quote=McGuffin;2328936]jQuery won’t work when it’s not loaded… you need to, at least, call all of your jQuery code from $(document).ready();

[http://docs.jquery.com/Tutorials:Introducing\_%24(document).ready()[/quote]](http://docs.jquery.com/Tutorials:Introducing_%24%28document%29.ready%28%29%5B/quote%5D)

I know, I’m just not good enough at js to add something to something that works without breaking it, because I never know how many });s I need and randomly adding }; tends to create other syntax errors.

I tried this which broke it and generated a runtime error

```auto
  $(document).ready(function(){
  function tab_change( parent, elm )
  {
   $('#'+parent+' .show').slideUp('fast', function(){ $('#'+elm).slideDown('normal').addClass('show'); }).removeClass('show').addClass('hide');
  }
  });

```

I also tried this which broke it and generated syntax error

```auto
  $(document).ready(function(){
    
  function tab_change( parent, elm )
  {
   $('#'+parent+' .show').slideUp('fast', function(){ $('#'+elm).slideDown('normal').addClass('show'); }).removeClass('show').addClass('hide');
 });

```

---

<div class="post-metadata">

**Author:** ![McGuffin](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/mcguffin/32/408_2.png) [@McGuffin](https://forum.kirupa.com/u/McGuffin)\
**Post date:** [May 21, 2008, 2:51am UTC](https://forum.kirupa.com/t/need-help-adding-document-ready-function/260913/4 "2008-05-21T02:51:17Z")

</div>

Just use a text editor and space it out as such:

```auto

$(document).ready(function(){
	function tab_change( parent, elm ) {
 		$('#'+parent+' .show')
			.slideUp('fast', function() {
				$('#'+elm).slideDown('normal').addClass('show');
			})
			.removeClass('show')
			.addClass('hide');
	}
});

```

It’s really not as difficult as you’re making it out to be.

---

<div class="post-metadata">

**Author:** ![somnamblst](https://avatars.discourse-cdn.com/v4/letter/s/a4c791/32.png) [@somnamblst](https://forum.kirupa.com/u/somnamblst)\
**Post date:** [May 21, 2008, 1:36pm UTC](https://forum.kirupa.com/t/need-help-adding-document-ready-function/260913/5 "2008-05-21T13:36:05Z")

</div>

tab\_change is not defined  
onclick(click clientX=0, clientY=0)

Here is the tute I started with [[COLOR=#005771]Animated Javascript Tabs in 1 Line of Code[/COLOR]](http://peps.ca/blog/animated-javascript-tabs-in-1-line-of-code/)

COLOR=#1872e2 One Line Tabs[/COLOR]

The author has several jQuery entries on his blog, I am starting to wonder if there is a reason why he didn’t begin with

$(document).ready(function(){  
// Your code here  
});

---

<div class="post-metadata">

**Author:** ![somnamblst](https://avatars.discourse-cdn.com/v4/letter/s/a4c791/32.png) [@somnamblst](https://forum.kirupa.com/u/somnamblst)\
**Post date:** [May 30, 2008, 2:20pm UTC](https://forum.kirupa.com/t/need-help-adding-document-ready-function/260913/6 "2008-05-30T14:20:20Z")

</div>

Here is what a javascript expert on another forum told me about why this function does not work with $(document).ready(function() );

> You are defining function tab\_change WITHIN the function that is executed as soon as the document is ready for DOM manipulation. Basically tab\_change is “trapped” within the anonymous function executed by the ready event and as soon as that is done executing, tab\_change is no longer visible. You need to define tab\_change “outside/indepent of” the anonymous function that is being executed by the ready event.

In case you are wondering what that anonymous function is, basically you are executing this:  
jQuery(document).ready( function(){…} );

the function(){…} IS the anonymous function, and in what you currently have you are defining tab\_change where the … are. It does NOT exist outside of that function. That’s why when you click on the tabs the function is not found (Hence the reason for the “Object expected” error in IE.