CODEWITHSUNDEEP
javascriptfunction
BitLion
BitLion

Reputation: 103

simple javascript: "Reference Error: 'click' is undefined"

So I'm making a satirical cookie-clicker based game as my first ever JS game.

I made a JSFiddle. (The image won't show, but the image is supposed to be a swag hat, which you click to get swag points.) My code is simple so far, but I was wondering why it told me my click() function was undefined. It's mentioned in the head and I don't know what's wrong.

http://jsfiddle.net/69mJq/

HTML:

<html>
<head>
    <title>Swag Dealr</title>
    <script src="swagdealr.js"></script>
    <link rel="shortcut icon" type="image/x-icon" href="img/favicon.ico" />
</head>
<body>

    <h3>SWAG DEALR</h3>
    <a href="JavaScript:click()"><img src="img/swaghat.png"></a>
    <p>grams of swag</p>
    <p id="swagnumber"></p>
    <p id=></p>

</body>
</html>

js:

Game={};

Game.Launch = function() {
}




window.onload = function() {
    Game.Load();
};        

Game.Load = function() {
    var swagAmount = 0;
    function click() {
        swagAmount + (1 * swagMultiplier) = swagAmount;
        document.getElementById("swagnumber").innerHTML = swagAmount;
    }
}

Upvotes: 0

Views: 1428

Answers (5)

loveNoHate
loveNoHate

Reputation: 1547

Short answer: You had it out of Scope.

Long answer:

Game.Load = function() {
  var swagAmount = 0;
  function click() {
    swagAmount = swagAmount + (1 * + "swagMultiplier?");
    document.getElementById("swagnumber").innerHTML = swagAmount;
    console.log('clicked')
  }
  window.click = click;
}

You had the swagAmount = reversed, thus giving a left hand assignment error.
And what is swagMultiplier, you never had it assigned, so I put it in "" to acknowledge that.

JSFIDDLE: http://jsfiddle.net/69mJq/7/

Upvotes: 1

Raja Asthana
Raja Asthana

Reputation: 2100

Game={};
Game.Load = function() {
    var swagAmount = 0;
    Game.click(swagAmount);

}  
Game.click = function(swagAmount) {
    var swagMultiplier= 5
    swagAmount = swagAmount + (1 * swagMultiplier) ;
    document.getElementById("swagnumber").innerHTML = swagAmount;
}
Game.Load();

I have defined swagMultiplier and its working fine. Change the href as

<a href="Game.click()"><img src="img/swaghat.png"></a>

Upvotes: 2

Shaik Mahaboob Basha
Shaik Mahaboob Basha

Reputation: 1082

We have two problems in your code

  1. You are assigning it wrongly
swagAmount + (1 * swagMultiplier) = swagAmount;

It should be

swagAmount = swagAmount + (1 * swagMultiplier);

  1. You are adding the click event to a Game.Load ( even though its possible), for the sake of simplicity we can add the click method to the Game object.

Sample code

 Game.click = function () {
    swagAmount = swagAmount + (1 * swagMultiplier);
        document.getElementById("swagnumber").innerHTML = swagAmount;
 }

JS Fiddle Demo At DEMO

NOTE:

We need to stop the default behaviour of the link using event.preventDefault()

Upvotes: 0

SpiderCode
SpiderCode

Reputation: 10122

Update your JS as mentioned below : 

Game={};

Game.Launch = function() {
}

window.onload = function() {
    Game.Load();
};     

Game.Load = function() {
}   

var swagAmount = 0;
function click() {
        swagAmount = swagAmount + (1 * swagMultiplier);
        document.getElementById("swagnumber").innerHTML = swagAmount;
    }

Note: One thing I have noticed that swagMultiplier is not defined anywhere.

Upvotes: 1

Johnny
Johnny

Reputation: 491

That's because your click() method is wrapped in an anonymous function. Drag it outside and it will work:

Game.Load = function() {
    var swagAmount = 0;
}
function click() {...}

See this fiddle: http://jsfiddle.net/JohnnyWorker/69mJq/6/

Upvotes: 1

Related Questions