Counter wont increment by decimals
我正在深入到JavaScript中,到目前为止,我已经在尝试做的事情上取得了相对成功。尽管我意识到我所做的大部分工作可能是做得不正确或效率低下。
对于我的第一个"项目",我试图做一个基本的游戏。点击鹤嘴锄,它会在你的岩石总量中增加+1。当你击中5块石头后,你可以买一把铲子,它会以每秒1块的速度为你生成石头。我现在必须将其设置为每秒1次,因为1下的任何内容都不起作用。
我的代码(它仍然有点混乱,因为我一直在修改它):
JSbin演示
HTML:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | Total Rocks: <input id="txtNumber" type="text" value="0" onfocus="this.blur()" style=" border:none; text-align:center; background-color:transparent;" /> <img style="border:0;" src="http://img2.wikia.nocookie.net/__cb20130308043142/minecraftpocketedition/images/6/6d/Pickaxe_1.jpeg" onclick="javascript:add()"> Rocks per second: <input id="perSec" type="text" value="0" onfocus="this.blur()" style="width:30px; border:none; text-align:center; background-color:transparent;" /> Shovel(<input id="shovelCount" type="text" value="0" onfocus="this.blur()" style="width:20px; border:none; text-align:center; background-color:transparent;" />): 5 rocks <input id="shovelBuy" type="button" value="Buy" onclick="javascript:shovel()"/> </body> |
javascript:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 | var totalRocks = 0; var rocksPerSec = 0; function increment() { var txtNumber = document.getElementById("txtNumber"); var newNumber = parseInt(txtNumber.value, 10) + rocksPerSec; txtNumber.value = newNumber; } setInterval(function(){increment();}, 1000); function add() { var txtNumber = document.getElementById("txtNumber"); var newNumber = parseInt(txtNumber.value, 10) + 1; txtNumber.value = newNumber; } function shovel() { var txtNumber = document.getElementById("txtNumber"); var value = parseInt(txtNumber.value, 10); if(value >= 5){ var newNumber = parseInt(txtNumber.value, 10) - 5; txtNumber.value = newNumber; var shovelCount = document.getElementById("shovelCount"); var newCount = parseInt(shovelCount.value, 10) + 1; shovelCount.value = newCount; rocksPerSec = rocksPerSec +1; return false; } } |
号
我的问题是:为什么我不能把计数器(rockpersec)增加一个十进制值?
作为第一个项目的帮助,我想我给出了一个结构化代码的建议
jfiddle:http://jsfiddle.net/j8cjs/
在这里,您可以使用
1 2 | var miner = new Miner(); miner.start(); |
号
它还允许重置和停止(或者更确切地说是贫穷)您当前的游戏。您的HTML代码会随着相对属性的更改而更改,并添加了一些我通常从jquery中借用的函数:)
我做了这个小提琴…你基本上要用
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 | var totalRocks = 0; var rocksPerSec = 0; function increment() { var txtNumber = document.getElementById("txtNumber"); var newNumber = parseFloat(txtNumber.value, 10) + rocksPerSec; txtNumber.value = newNumber; } setInterval(function(){increment();}, 1000); function add() { var txtNumber = document.getElementById("txtNumber"); var newNumber = parseFloat(txtNumber.value, 10) + 1; txtNumber.value = newNumber; } function shovel() { var txtNumber = document.getElementById("txtNumber"); var value = parseFloat(txtNumber.value, 10); if(value >= 5){ var newNumber = parseInt(txtNumber.value, 10) - 5; txtNumber.value = newNumber; var shovelCount = document.getElementById("shovelCount"); var newCount = parseFloat(shovelCount.value, 10) + 1; shovelCount.value = newCount; rocksPerSec = rocksPerSec + 0.2; return false; } } |