Js function not defined

Question

I was working on a simple show and hide function and it kept telling me that it's not defined.

Here's the HTML:

<address>
<a id="windows" href="#" onclick="toggle();">
<img src="imges/c980e3f5-badf-432a-ae6c-9e5341d13462.png" alt="" />
</a>
</address>
         <p class="right_page">
           this is sample of the book container<br/>
           thats suppose to read from ajax
            </p>

and here the function

    <script type="text/javasript">
function toggle() 
{
    var ele = document.getElementById("right_page");
    var text = document.getElementById("windows");
    if(ele.style.display == "block") {
            ele.style.display = "none";
        text.innerHTML = "show";
    }
    else {
        ele.style.display = "block";
        text.innerHTML = "hide";
    }
} 

</script>

Please post the exact error message you're getting (i.e. what exactly is not defined). — August Lilleaas
– August Lilleaas, Commented Jul 18, 2011 at 8:07

detaylor · Accepted Answer · 2011-07-18 08:23:47Z

2

I think it is due to a typo in your script tag. Change type="text/javasript" to type="text/javascript" (missing the c).

Update

Your image is being removed from the DOM due to you setting the innerHtml to a string. This overwrites the image which is part of the innerHtml.

The first time that you run toggle() there is not an inline style for display so ele.style.display will be an empty string. This means that it will drop into the logic for showing the paragraph. On subsequent calls the property will have a value so it should behave as you expect.

edited Jul 18, 2011 at 8:23

answered Jul 18, 2011 at 8:09

detaylor

7,3001 gold badge29 silver badges46 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Aly_Elgahy Over a year ago

oops yeah its work but work very strange its replace the link background image with hide and show word and so its hide the image of the link not the div i want it to hide

Felix Kling Over a year ago

@aly1984: Does the div also have the ID windows? IDs have to be unique.

Ben · Accepted Answer · 2011-07-18 08:14:26Z

1

There are a couple of things wrong here:

Did you paste this in directly from your code? If so, your <script type... line contains a typo (should be "javas*c*ript")
You can't use getElementById() for right_page as it stands, because right_page is only defined as a class in your mark-up.

answered Jul 18, 2011 at 8:14

Ben

7,59533 silver badges46 bronze badges

1 Comment

Ben Over a year ago

You need to sort the rest of your code out too. For example, setting innerHTML on windows means that your image is effectively removed from the page and replaced with some text.

Mihai Iorga · Accepted Answer · 2012-09-28 09:42:00Z

0

First you missed the C change type="text/javascript", second the right_pae is not a ID, can't use document.getElementById because there are something wrong with your function, so it tells you the function is undefined

edited Sep 28, 2012 at 9:42

Mihai Iorga

39.8k17 gold badges109 silver badges109 bronze badges

answered Aug 3, 2012 at 2:40

zhaolibin

1

Collectives™ on Stack Overflow

Js function not defined

3 Answers 3

Update

2 Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Update

2 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related