Question

我的代码在这里遇到了一些问题。我正在做一个有趣的小项目，但有一个小问题，＆＃39;我不明白。

我的项目是一个基本的小计算：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

Answer 1

因为输入值为空，并且不会根据需要自动表示为零。

当它为空时尝试将其强制为零。

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

Answer 2

如果您不输入任何内容，则值的值为“”（空字符串）。然后，将“”分配给value_ingots，这是您在输出中看到的内容。

Answer 3

显示0 Ingots，然后由JS函数setInterval()替换。

使用onclick=或onblu=您的问题时间间隔似乎不切实际。您将更好地处理输入。

Answer 4

这可能更直观：

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"/>

Javascript在其中一个变量上没有输出0？

4 个答案: