按钮，增加减少函数为一个html的数字限制。

Question

所以，我对html很陌生，我想知道如何制作一个带有加减函数(-/+)的按钮。

整体应该是这样的

<button>-</button>
<input type="number"  min="0"
input type="number"  max="20">
<button>+</button>

(非常简单的例子)但是我唯一能得到的就是这个输入

<input type="number"  min="0"
input type="number"  max="5">

我设法让结果机器人更长的时间，但我失去了命令，所以.如果有人想办法让它变长.主要任务..。我会非常伟大的！(按钮应增加1和-1)

Answer 1

您可以通过给输入一个id并通过按钮的onclick函数(使用querySelector)来定位它。然后使用三元运算符有条件地赋值。

​

<button onclick="document.querySelector('#steve').value=parseInt(document.querySelector('#steve').value)<1?parseInt(document.querySelector('#steve').value):parseInt(document.querySelector('#steve').value)-1"">-</button>
<input type="number" id="steve" min="0" max="20" value=0>
<button onclick="document.querySelector('#steve').value=parseInt(document.querySelector('#steve').value)>19?parseInt(document.querySelector('#steve').value):parseInt(document.querySelector('#steve').value)+1">+</button>

​