無法驗證輸入類型編號的點

Question

我正在嘗試為輸入類型號添加驗證以僅接受整數。 我在元素中添加了pattern="\\d*" 。 它對於輸入10.12和10.13 。 但是輸入10.失敗10.

我打印了html輸入的值。 它是10而不是10. 。

<script>
    function getValue(){
        alert(document.getElementById("numberInput").value);
    }   
</script>   

<input type="number" id="numberInput"> </input>
<button onclick="getValue();">

理想情況下，應將10.視為無效輸入。

Answer 1

粘貼確實很棘手。 我想出了以下幾點：

 function setValid(target) { const val = target.value; // Remove value, as setting the same value has no effect. target.value = ''; // Reset value on the next tick requestAnimationFrame(() => target.value = val); } 

 <form action="#" method="post"> Numbers: <input name="num" type="number" min="1" step="1" onblur="setValid(this)" onpaste="requestAnimationFrame( () => setValid(this) )" onkeypress="return event.charCode >= 48 && event.charCode <= 57" title="Numbers only"> <input type="submit"> </form> 

它的作用如下：

1. 當輸入失去焦點時，它將重置該值
2. 粘貼時，它將等待直到設置了值，然后將其重置。

可能還有更好的解決方案。

該答案基於此處的kneeki答案 。