在JavaScript中实例化文本字段值之外的变量

时间:2014-04-24 02:25:12

标签: javascript variables textfield

所以我尝试了很多关于如何从输入文本字段中获取值并将其存储在全局变量中的不同建议。我正在研究这个游戏,它需要从得分文本字段中获取值,并为黑色杰克风格游戏添加随机数。除了得分变量,我的一切都在工作。这似乎很简单,但我无法弄清楚为什么变量不会存储和/或更新值。如果有人可以帮助我,那就太棒了。

enter image description here

这是我的代码:

<html>
<head>
  <title>Project 3</title>

  <style type="text/css">
    body  { background:BlanchedAlmond; color:DarkOrange; font-family: sans-serif; font-weight:bold }
    input { text-align:center; background:DarkOrange; color:RoyalBlue; font-weight:bold }
    td    { margin:0; padding:10 }
  </style>


  <script language="JavaScript">






 function doFunction(ref)
 {
   score =document.getElementById("1").value;
    if (ref.value== "X")
    {
       randnum=Math.floor( 9*Math.random() ) + 1;
      ref.value=randnum;
     score = score + ref.value;

   }

   if(score > 21)
   {
      window.alert ("You hit " + ref.value + " You have lost");
   }

   if(score == 21)
   {
      window.alert ("Congradulations! You hit 21 and have won the game!");
   }

 }
  </script>
</head>
<body>

<center>
<h3>Uncover 21</h3>
<form name = "myform" >
<TABLE>
<TR>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
</TR>
<TR>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
</TR>
<TR>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>

</TR>
<TR>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
</TR>
<TR>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
</TR>
<TR>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
<TD><input id="button" type="button" value="X" onclick="doFunction(this)" /></TD>
</TR>

</TABLE>
Your Score <input id="1"  type="text" name="Score" value="0" readonly /><br>
<input id="resetbutton" type="reset" value ="Restart Game" onclick="document.location.reload()" />
</form>


</center>
</body>
</html>

2 个答案:

答案 0 :(得分:1)

您没有更新得分字段。此

function doFunction(ref)
 {
   score =document.getElementById("1").value;

   if (ref.value== "X")
    {
      randnum=Math.floor( 9*Math.random() ) + 1;
      ref.value=randnum;
      score = parseInt(score + ref.value, 10);
      document.getElementById("1").value = score;
   }
}

您还必须将第一个警报更改为

  if(score > 21)
  {
    window.alert ("You hit " + score + " You have lost");
  }

答案 1 :(得分:0)

您需要解决两件事。

1:您的号码正在连接,正在制作一个&#34;字符串&#34;数字。所以你需要将数字乘以1。

2:您没有更新HTML。

你应该:

if (ref.value == "X") {
    randnum = Math.floor( 9*Math.random() ) + 1;
    ref.value=randnum;
    //Multiply by 1 here to force the recognition of arithmetic instead of concatenation
    score = (score * 1) + (ref.value * 1);
    //You are missing the following line
    document.getElementById("1").value = score
}