Each time submit button is clicked, I would want the Experience to increment by 1. I have declared Experience as global variable, however the Experience does not go beyond 2.
<html>
<head>
<script>
var Experience = 1;
function scenario1()
{ window.Experience = window.Experience + 1 ;
alert(window.Experience);
}
</script>
</head>
<body>
<form>
<input type="submit" onclick="scenario1()">
</form>
</body>
</html>
Open up your developer tools and watch the network tab.
When you click the submit button, it will:
You need to prevent the page from submitting.
There are two approaches.
Approach 1: Prevent the submit
<html>
<head>
<script>
var Experience = 1;
function scenario1() {
// Shorthand way to write it
window.Experience++;
alert(window.Experience);
}
</script>
</head>
<body>
<form>
<input type="submit" onclick="scenario1(); return false">
</form>
</body>
</html>
Approach 2: Use a button that doesn't submit
<html>
<head>
<script>
var Experience = 1;
function scenario1() {
// Shorthand way to write it
window.Experience++;
alert(window.Experience);
}
</script>
</head>
<body>
<form>
<button type="button" onclick="scenario1()">Do it</button>
</form>
</body>
</html>
Extra notes
Lots of global variables is generally a pretty bad idea. If this is for a game of some sort, you'd be better putting everything into a player object.
var player = {
experience: 0,
name: "Just some guy"
};
// Grant experience
player.experience += 10;
