CODEWITHSUNDEEP
javascriptfunction
user1433032
user1433032

Reputation: 43

Multiple Functions in Javascript

I'm sorry if this is a really stupid question, I'm a little new to JavaScript. I am trying to make a webpage containing multiple functions, but only the first of the functions will be successful. I searched on google and I only got results for calling multiple functions at once, but that is not what I am looking for. Here is an example of what I am trying to do:

<html>
    <head>
        <script type="text/javascript">
            function frogger()
            {
                document.getElementById("descriptions").innerHTML="Frogger <br />Description: Get
                    the frog to the islands at the top of the screen without falling into the water or
                    getting hit by cars. <br />Controls: Up arrow key to move forward, down arrow key to
                    move backward, left arrow key to move left, and right arrow key to move right.";
            }
            function clear()
            {
                document.getElementById("descriptions").innerHTML=" ";
            }
        </script>
    </head>
    <body>
        <div id="descriptions" style="{height:100;}">
        </div>
        <div class="game" onmouseover="frogger()" onmouseout="clear()">
            <a href="/arcade/frogger.html"><img border="0" src="http://ggmedia.site50.net
/pics/frogger.PNG" height="100" width="100" /><br />Frogger</a>
        </div>
    </body>
</html>

Thanks for helping!

Upvotes: 2

Views: 49304

Answers (5)

Andrew
Andrew

Reputation: 3969

function frogger() {
    document.getElementById("descriptions").innerHTML="Frogger <br />Description: Get the frog to the islands at the top of the screen without falling into the water or getting hit by cars. <br />Controls: Up arrow key to move forward, down arrow key to move backward, left arrow key to move left, and right arrow key to move right.";
}

Upvotes: 2

Vinyl Windows
Vinyl Windows

Reputation: 503

  <div class="game" onmouseover="frogger()" onmouseout="clearr()">mousee</div>
    <div id="descriptions"></div>
    <script type="text/javascript">
        var frogger = function () {
            this.innerHTML = ["Frogger <br />Description: Get}",
                    "the frog to the islands at the top of the screen without falling into the water or",
                    "getting hit by cars. <br />Controls: Up arrow key to move forward, down arrow key to",
                    "move backward, left arrow key to move left, and right arrow key to move right."].join('');
        }.bind(document.getElementById("descriptions"));
        //
        var clearr = function () {
            this.innerHTML = " ";
        }.bind(document.getElementById("descriptions"));

    </script>

Here is this code in a jsfiddle.net

http://jsfiddle.net/gerst20051/6Neqv/

Upvotes: 0

Musa
Musa

Reputation: 97727

Your string has line breaks, you can remove them or add a \ to the end of each line

function frogger()
{
    document.getElementById("descriptions").innerHTML="Frogger <br />Description: Get\
the frog to the islands at the top of the screen without falling into the water or\
getting hit by cars. <br />Controls: Up arrow key to move forward, down arrow key to\
move backward, left arrow key to move left, and right arrow key to move right.";
}

​ Edit: If you change the name of the clear function to say clearx it works, weird.

Edit: Apparently there is a clear method in the document object

Upvotes: 2

sachleen
sachleen

Reputation: 31141

Rename the clear() function to something else. I changed it to clearDesc() and it worked fine (after fixing the line break issue in the string). See here.

Upvotes: 0

Guffa
Guffa

Reputation: 700860

There is already a function named clear in the document object. Name your function something else.

Upvotes: 6

Related Questions