我有一個數字型別的輸入欄位,當我輸入點時,我沒有得到值。所以我想要實作的是我不希望用戶在輸入欄位上輸入點
function handleChange (value) {
console.log(value)
}
<input type="number" onchange="handleChange(this.value)"/>
在輸入的每個數字上,我都得到了值,但是當我輸入點 (.) 時,我不知道如何在用戶輸入時阻止它
uj5u.com熱心網友回復:
<input name="num" type="number" min="1" step="1" onkeypress="return event.charCode >= 48 && event.charCode <= 57">
來自這個網址的參考 https://stackoverflow.com/a/44379790/4316212
uj5u.com熱心網友回復:
添加這個 oninput="this.value = this.value.replace(/[^0-9]/, '')"
function handleChange (value) {
console.log(value)
}
<input type="number" onchange="handleChange(this.value)" oninput="this.value = this.value.replace(/[^0-9]/, '')"/>
uj5u.com熱心網友回復:
如果你想阻止'.' 你可以用這種方式
function handleChange (value) {
console.log(value)
}
var inputBox = document.getElementById("inputBox");
var invalidChars = [
".",
];
inputBox.addEventListener("keydown", function(e) {
if (invalidChars.includes(e.key)) {
e.preventDefault();
}
});
<input type="number" id="inputBox" onchange="handleChange(this.value)/>
uj5u.com熱心網友回復:
使用行內事件處理程式通常不是一個好主意。
為了獲得更多控制,您應該檢查/使用數字輸入的屬性。
如果您想完全控制輸入??,請使用只讀欄位并使用您自己的處理程式進行處理。這是使用事件委托的片段。
document.addEventListener('click', handle);
function handle(evt) {
if (evt.target.dataset.numinput) {
document.querySelector(`#num`).value =
document.querySelector(`#num`).value
(`${evt.target.dataset.numinput}1`);
}
}
<input id="num" type="number" readonly/>
<button data-numinput="-"> - </button>
<button data-numinput=" "> </button>
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/378799.html
標籤:javascript html
