請幫忙,如何在javascript中進行這樣的輸入?可以輸入的最小數字 = 0.01 可以輸入的最大數字 = 94.99 如果超過最小/最大,它將自動回傳到最小/最大的默認數字。同時,如果您輸入數字 01.21,數字將自動變為 1.21
感謝您花時間回答,并提供指導。
我想創建一個與此類似的輸入欄位
我試過這樣但它不起作用
function minmax(value, min, max) {
if (parseInt(value) < 0.01 || isNaN(value))
return 0.01;
else if (parseInt(value) > 94.99)
return 94.99;
else return value;
}
<input type="text" name="textWeight" id="txtWeight" maxlength="5" onkeyup="this.value = minmax(this.value, 0.01, 94.99)" />
uj5u.com熱心網友回復:
您可能甚至不需要為此使用 JavaScript,只需純 HTML 即可解決您的問題。該input標簽具有min和max屬性,用于設定輸入的最小值和最大值。此外,您可以將step輸入的 設定為 0.01。
這應該可以解決您在前端的問題。但請注意,這不足以確保后端接收到的資料(如果是這種情況)符合您的規范,因為惡意用戶可以更改您的頁面并發送資料,甚至繞過前端完全地。因此,后端還應檢查接收到的資料格式是否正確。
uj5u.com熱心網友回復:
您可以為此使用onchange事件或將事件偵聽器添加到輸入欄位和 min, max 以指定最大和最小數量。
<input id="input1" type="number" onchange="minmax()" min="0.01" max="94.99">
然后,您可以使用 javascript 使用 if 條件將用戶輸入的值與最小值和最大值進行比較。如果用戶輸入的值無效,只需將輸入欄位值替換為最小值或最大值!
使用parseFloat()因為您正在處理浮點數。
function minmax() {
let inp_field = document.getElementById("input1");
let val = parseFloat(inp_field.value),
min = parseFloat(inp_field.min),
max = parseFloat(inp_field.max);
if (val < min) {
inp_field.value = min;
} else if (val > max) {
inp_field.value = max;
} else {
inp_field.value = val;
}
}
對于最后一部分,parseFloat將通過清除前導零自動為您執行此操作。
uj5u.com熱心網友回復:
- 此事件處理程式系結到輸入事件
document.querySelector('#x').oninput = limit;
- 它有兩個作業。第一項作業是限制低于 0.01 或高于 94.99 的輸入
this.value = v < .01 ? '.01' : v > 94.99 ? '94.99' : v;
- 第二項作業是洗掉任何前導零
this.value = v.replace(/^0 /, '');
document.querySelector('#x').oninput = limit;
function limit(e) {
let v = this.value;
this.value = v < .01 ? '.01' : v > 94.99 ? '94.99' : v;
this.value = v.replace(/^0 /, '');
}
<input id='x' type='number' min='.01' max='94.99'>
uj5u.com熱心網友回復:
- 呼叫
onchange方法
function minmax(value, min, max) {
if (parseInt(value) < 0.01 || isNaN(value))
return 0.01;
else if (parseInt(value) > 94.99)
return 94.99;
else return value;
}
<input type="text" name="textWeight" id="txtWeight" maxlength="5" onchange="this.value = minmax(this.value, 0.01, 94.99)" />
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/488776.html
標籤:javascript jQuery 改变
