Question

我只是想以某种形式增加数字。这行得通，但是输入很大，尝试调整大小没有运气。而且我不希望在输入框中增加/减少增量。将框更改为文本，可以调整大小并没有上/下大小。但是增量不起作用。

有没有更简单的方法。同样，当我将<form>标记放入时，加减按钮不起作用。

function HaFunction() {
  document.getElementById("HNumber").stepUp();
}

function HmFunction() {
  document.getElementById("HNumber").stepDown();
}

Number: <input type="number" id="HNumber" class=verd15 value="0">
<span class=verd13>
  <button onclick="HaFunction()"><b>+</b></button>
  <button onclick="HmFunction()"><b>-</b></button>
</span>

Answer 1

您可以使用CSS缩小输入范围：

<input style="width:40px" type="number" id="HNumber" class=verd15 value="0">

希望这对您有帮助

Answer 2

您可以编写自己的函数来增加文本输入中的数字。

如果您有表格，请确保您的按钮使用type="button"。默认情况下为type="submit"，因此单击按钮将提交表单，然后您将重新加载页面。

function addToInput(element, amount) {
  var val = parseInt(element.value, 10) || 0;
  val += amount;
  element.value = val;
}

function HaFunction() {
  addToInput(document.getElementById("HNumber"), 1);
}

function HmFunction() {
  addToInput(document.getElementById("HNumber"), -1);
}

<form>
  Number: <input type="text" id="HNumber" class=verd15 value="0">
  <span class=verd13>
    <button type="button" onclick="HaFunction()"><b>+</b></button>
    <button type="button" onclick="HmFunction()"><b>-</b></button>
  </span>
</form>

Javascript-表格中的递增数

2 个答案: