我想用JS,HTML,CSS创建一个口袋妖怪相关的网站。 (可能以后使用PHP)。我正在创建一个名为'硬币'的变量。这个硬币变量允许人们购买口袋妖怪。然而,当我测试了一个买了一个花费100美元的魔力卡,硬币没有更新。但是当我在控制台上输入'硬币'时,它会显示900.(1000首首币硬币--100硬币用于magikarp = 900)我不知道为什么这不起作用。请帮忙!变量不改变Javascript
var coins = 1000;
var pokemonagainstTutorial = "Magikarp";
var pokemonchosen = [];
//HP For Pokemon - Start
var hpmagikarp = 100;
var hpcharmander = 100;
var hpbulbasaur = 100;
var hpsquirtle = 100;
//HP For Pokemon - End
function comingsoonOnline() {
swal({
title: "Coming Soon!",
text: "PokemonUpgrade doesn't support online\n in Alpha mode. Check back later!",
type: "warning",
confirmButtonText: "OK"
});
}
function comingsoonPurchase() {
swal({
title: "Coming Soon!",
text: "PokemonUpgrade doesn't support purchases\n in Alpha mode. Check back later!",
type: "warning",
confirmButtonText: "OK"
});
}
//Start ALL functions for pokemon
function gift() {
//swal("Free!", "Pokemonupgrade release gift! Welcome to pokemonupgrade.com!", "success");
}
function buymagikarp() {
if(coins >= 100) {
swal("Success", "You bought 1 magikarp!", "success");
coins -= 100;
pokemonchosen.push("Magikarp");
} else {
swal("Error", "Not enough balance", "error");
}
}
function buycharmander() {
if(coins >= 500) {
swal("Success", "You bought 1 charmander!", "success");
coins -= 500;
pokemonchosen.push("Charmander");
} else {
swal("Error", "Not enough balance", "error");
}
}
function buybulbasaur() {
if(coins >= 500) {
swal("Success", "You bought 1 bulbasaur!", "success");
coins -= 500;
pokemonchosen.push("Bulbasaur");
} else {
swal("Error", "Not enough balance", "error");
}
}
function buysquirtle() {
if(coins >= 500) {
swal("Success", "You bought 1 squirtle!", "success");
coins -= 500;
pokemonchosen.push("Squirtle");
} else {
swal("Error", "Not enough balance", "error");
}
}
function buyzubat() {
if(coins >= 250) {
swal("Success", "You bought 1 zubat!", "success");
coins -= 250;
pokemonchosen.push("Zubat");
} else {
swal("Error", "Not enough balance", "error");
}
}
function buypidgey() {
if(coins >= 300) {
swal("Success", "You bought 1 pidgey!", "success");
coins -= 300;
pokemonchosen.push("Pidgey");
} else {
swal("Error", "Not enough balance", "error");
}
}
function buygastly() {
if(coins >= 750) {
swal("Success", "You bought 1 gastly!", "success");
coins -= 750;
pokemonchosen.push("Gastly");
} else {
swal("Error", "Not enough balance", "error");
}
}
//End All functions for pokemon
//document.getElementById('').innerHTML = \\
//document.getElementById('coinsleft').innerHTML = "Coins: " + coins;
//Tips&Tricks
function tipsandtricks() {
swal({
title: "Tips and tricks!",
text: "Don't only try to buy expensive pokemon, try\n evolving the ones you have right now!",
imageUrl: "images/magikarp.gif",
});
}
function giveaways() {
swal({
title: "Giveaways",
text: "We will do giveaways for special events (holidays, anniversaries, etc.) for either really rare pokemon or pokemon not available in the shop!",
imageUrl: "images/arceus.gif"
});
}
function battle() {
if(pokemonchosen.length > 0){
swal({
title: "Start battle?",
text: "Are you sure you want to start battle?",
type: "info",
showCancelButton: true,
closeOnConfirm: false,
showLoaderOnConfirm: true,
},
function(){
setTimeout(function(){
}, 2000);
});
} else {
swal("Error", "You don't have any pokemon to fight with!", "error");
}
}
function getName() {
if(localStorage.getItem('coins') === null) {
var coins = 1000;
localStorage.setItem('coins', coins);
} else {
coins = localStorage.getItem('coins');
}
document.getElementById("p1").innerHTML = "Coins: " + coins;
}
<!DOCTYPE HTML>
<!--
\t Photon by HTML5 UP
\t html5up.net | @ajlkn
\t Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html>
\t <head>
\t \t <title>PokemonUpgrade Offline</title>
\t \t <script src="dist/sweetalert.min.js"></script>
\t \t <style>.sweet-alert fieldset input {
display: none;
} \t </style>
\t \t <link rel="stylesheet" type="text/css" href="dist/sweetalert.css">
\t \t <meta charset="utf-8" />
\t \t <meta name="viewport" content="width=device-width, initial-scale=1" />
\t \t <!--[if lte IE 8]><script src="assets/js/ie/html5shiv.js"></script><![endif]-->
\t \t <link rel="stylesheet" href="assets/css/main.css" />
\t \t <!--[if lte IE 8]><link rel="stylesheet" href="assets/css/ie8.css" /><![endif]-->
\t \t <!--[if lte IE 9]><link rel="stylesheet" href="assets/css/ie9.css" /><![endif]-->
\t </head>
\t <body onload="getName();">
\t <center>
\t <br>
\t <img src="images/coins.png" width="30px" height="30px">
\t <p id="coinsleft"></p>
\t <button onclick="tipsandtricks();">Tips and tricks</button>
\t <button onclick="giveaways();">Giveaways</button>
\t <p>Buy Pokemon and use them for battle:</p>
\t <button onclick="battle();">Battle</button>
\t <p id="p1"></p>
\t <script src="script.js"></script>
</html>
注:SwaI位手段sweetalert你可以检查出甜蜜的警报here更多信息。
(注:我觉得是不是手头的主题重要删除代码。)
该变量显然是更新,你的测试在控制台demonstr吃了这个。不过,更改变量并不意味着UI会自动更新,这就是发生的情况。您必须更新您的用户界面。 – Amy