Uncaught ReferenceError: 'functionName' not defined

Question

So I have checked my script tags in my .jsp file:

<script type="text/javascript" src="javascript/jquery-1.3.1.min.js"></script>

<script language="JavaScript" > "some content here ...." </script>

and below in the same .jsp file I have a tag:

<body BGCOLOR="white" text="black" link="blue" vlink="red" onLoad="functionName();enableBackButton();">

However, in my JavaScript file I have:

$(document).ready(function(){
$('current').click(function(event){

    function functionName() { ....... }

Somehow I keep getting an error in my Chrome console stating:

Uncaught ReferenceError: functionName is not defined

@pointy, the system is ancient itself. I wish it was all mine haha... — Arty, Feb 24 '14 at 16:50
OK, but be aware that it's likely to have problems with newer browsers, including IE9+. — Pointy, Feb 24 '14 at 17:03

score 6 · Accepted Answer · answered Feb 24 '14 at 16:42

6

Move your functionName() out side of $(document).ready(function(){

function functionName() { ....... }

$(document).ready(function(){
    $('.current').click(function(event){
        functionName();
    });
});

Also, you need to use . to target element by class or # to target element by id

So $('.current') will select any element with class="current" and $('#current') will select an element with id="current"

Last note is to update your jQuery version since 1.3.1 is extremely outdated already and it lacks of many helpful and important features which is supported by later versions.

answered Feb 24 '14 at 16:42

Felix

37,892
8
43
55

thanks for the usage of {.} and {#}. I learn new things everyday. :) – Arty Feb 24 '14 at 16:52
could it be possible to have function functionName { and an ajax call in here} ? In this case having a function that also performs an ajax call when called? Thanks. – Arty Feb 25 '14 at 11:49
Yes, of course. Also, you can go through this thread: http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-ajax-call if you intend to return a value from your ajax call – Felix Feb 25 '14 at 13:47

score 3 · Answer 2 · edited May 23 '17 at 11:53

3

Don't wrap your function in DOM ready($(document).ready(function(){) handler.As it is a anonymous function so your functionName() function has local scope.So you can not call it outside the DOM ready

Read What is the scope of variables in JavaScript?

http://api.jquery.com and http://learn.jquery.com

edited May 23 '17 at 11:53

Community

1
1

answered Feb 24 '14 at 16:43

Tushar Gupta - curioustushar

58,085
24
103
107

score 3 · Answer 3 · answered Feb 24 '14 at 16:46

Moving the function would be one way to fix it, but an alternative is to simply call the function from your "ready" handler, or if it really matters that all page content is loaded, from a "load" handler:

$(document).ready(function() {
  function functionName() {
    // whatever
  }

  functionName();
});

Polluting the global namespace unnecessarily is generally a bad thing.

Suman Bogati · Answer 4 · 2014-02-24T16:55:26.597

function functionName() { should defined outside the $(document).ready(function(){, like

function functionName() {...}
$(document).ready(function(){...});

If you defined it inside the document.ready then it's scope would limit into this function.

Only you can defined when the functionName() would call from inside $(document).ready( like

$(document).ready(function(){
   function functionName() {...}
      // but in your case below function 
      // is calling from body when its loaded
      functionName(); //from here you can call
    } 
  );

score 2 · Answer 5 · answered Feb 24 '14 at 16:46

2

When you call functionName in onLoad, the function is not yet in the document. Try to put the function functionName out. For instance,

<script language="JavaScript" > 

"some content here ...." 

function functionName() {
  your function
}

</script>

answered Feb 24 '14 at 16:46

Rafa Hernández

468
7
19

Uncaught ReferenceError: 'functionName' not defined

5 Answers5

Linked