为什么条形图表现如此奇怪？ html5 canvas和javascript [英] Why are bar graphs acting so strangely? html5 canvas, and javascript

问题描述

对于我第一次进入html5，我试图为游戏Farkle制作一个记分牌。

我已经想出了如何使跛脚看起来功能

我意识到我的代码可以更好，但我didn不想写辅助函数，直到我确定它将如何工作。

现在，我从盒子中得到奇怪的行为。而不是添加tally到总分，并绘制一个框，以反映新的分数，它做一些我不明白的东西。尝试键入10，然后90为同一个播放器看看我的意思。

这里是一个工作版本，这样你可以看到我的问题。 http://jsfiddle.net/kBJB4/

编辑：看起来像它，而不是正常添加数字，例如。 1 + 1 = 2，它正在做某种附加事情，例如。 1 + 1 = 11。我不知道为什么。

解决方案

prompt（）返回一个字符串。因此，在以下语句中的变量 tally

var tally = prompt ）;

实际上是一个字符串。因此，将 + 运算符应用于字符串操作数和整数操作数会导致将两个操作数视为字符串，并执行字符串连接而不是整数加法。一个简单的解决方法是将 prompt（）的返回值转换为整数，如：

  var tally = parseInt（prompt（Score？））; 
  

For my first foray into html5, I'm trying to make a scoreboard for the game Farkle.

I have figured out how to make a lame looking but functional graph system for up to five players, but I cannot figure out how to have it update more than once.

I realize that my code could be much better, but I didn't want to write helper functions until I was sure how it would work.

As it is now, I'm getting weird behavior from the boxes. Rather than adding the "tally" to the total score, and drawing a box to reflect the new score, it does something that I don't understand. Try typing 10, and then 90 for the same player to see what I mean.

Here is a "working" version, so that you can see my problem. http://jsfiddle.net/kBJB4/

edit: It seems like it rather than adding the numbers normally, eg. 1+1=2, it is doing some kind of append thing, eg. 1+1=11. I have no idea why.

解决方案

The prompt() function call returns a string. So the variable tally in the following statement

var tally = prompt("score?");

is actually a string. So applying + operator to a string operand and an integer operand results in treating both the operands as string and performing string concatenation instead of integer addition. A simple fix is to convert the return value of prompt() to integer like:

var tally = parseInt(prompt ("Score?"));

这篇关于为什么条形图表现如此奇怪？ html5 canvas和javascript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！