Javascript未在其中一个变量上输出0

Javascript Not outputting 0 on one of the variables?

本文关键字:变量 一个 输出 在其中 Javascript      更新时间:2023-09-26

我在这里的代码遇到了一些问题。我正在做一个有趣的小项目,但有一个小问题"我不明白"。

我的项目是一个基本的小计算:1块=9锭。用户输入铸锭的数量,并获得他们将获得的块和铸锭的数量。我有一个功能来检查输入是否是数字,但这不是问题所在。

JavaScript:

setInterval(function(){
  // Get the input assign it to 'value'
  var value = document.getElementById('input').value;
  // Define variables and set them to 0
  var value_ingot = 0;
  var value_block = 0;
  // Add 1 to block if value is 9 or higher
  //   Remove 9 from value
  while (value > 8){
    value = value - 9;
    value_block ++;
  }
  value_ingot = value;
  value = value - value;
  // This makes it output: '0 Blocks' and ' Ingots' if the input is empty
  document.getElementById("blocks").innerHTML = value_block + " Blocks";
  document.getElementById("ingots").innerHTML = value_ingot + " Ingots";
}, 1000);

HTML:

<h4 id="blocks" class="c_top">0 Blocks</h4>
<h4 id="ingots" class="c_top">0 Ingots</h4>
<input onkeypress="return isNumber(event);" id="input" type="text" autocomplete="off" maxlength="8"/>

你知道是什么原因造成的吗,有什么办法解决吗?

感谢阅读:)-Aleksander

这是因为输入值为空,不会根据需要自动表示为零int。

当它为空时,试着强制它为零。

var value = document.getElementById('input').value;
if(!value) value = 0;

如果不输入任何内容,则value的值为"(空字符串)。然后将"分配给value_ingots,这就是您在输出中看到的内容。

显示0 Ingots,然后用JS函数setInterval()替换。

对于您的问题,间隔似乎不实用,使用onclick=onblu=可以更好地处理输入。

这可能更直观:

var myInput = document.getElementById('input');
myInput.addEventListener('input', function(){
  var v = +myInput.value;
  document.getElementById("blocks").innerHTML = Math.floor(v/9) + " Blocks";
  document.getElementById("ingots").innerHTML = (v%9) + " Ingots";
});
function isNumber(e){
  return !isNaN(parseInt(String.fromCharCode(e.which), 10));
}
<h4 id="blocks">0 Blocks</h4>
<h4 id="ingots">0 Ingots</h4>
<input id="input" onkeypress="return isNumber(event);" type="text"/>