[英]Allow html input box to only enter one full number and exactly decimal .5
I'm making web application that requires users to enter number with one decimal place. 我正在制作要求用户输入小数点后一位数字的Web应用程序。 I restrict users from entering other characters that numbers from using this javascript code
我限制用户输入使用此javascript代码编号的其他字符
html html
<input type="number" name='days' class="w3-input w3-padding-tiny" id="cntday" onkeypress="return isNumberKey(event)" placeholder="Enter days"/>
javascript javascript
function isNumberKey(evt) {
var charCode = (evt.which) ? evt.which : evt.keyCode;
if (charCode != 46 && charCode > 31 &&
(charCode < 48 || charCode > 57))
return false;
return true;
}
but this function only prevent users from entering characters other than numbers. 但是此功能仅阻止用户输入数字以外的字符。 I need to prevent users from entering more than one decimal places as well as entered decimal should be .5
我需要防止用户输入多个小数位以及输入的小数应为.5
it's like this 就像这样
if user enter 5.55 it should replace with 5.5 OR prevent user to input additional decimal 如果用户输入5.55,则应替换为5.5或阻止用户输入其他小数
and if user enter 5.2 OR any decimal it should be replace with 5.5 in other words users should only able to enter number with decimal .5 如果用户输入5.2或任何小数,则应将其替换为5.5,换句话说,用户只能输入带小数.5的数字
how can I achieve this with my current onkeypress function ? 如何使用当前的onkeypress函数实现此目的?
This is NOT a duplicate of the other question. 这不是另一个问题的重复。 Stop flagging this
停止举报
You can do it by split the number into two parts: 您可以通过将数字分为两部分来实现:
Part 1 for natural number. 第1部分为自然数。
Part 2 for decimal number. 第2部分为十进制数字。
then you can replace any entered decimal number to .5
那么您可以将任何输入的十进制数字替换为
.5
Something like this: 像这样:
$('input').keyup(function() { var value = this.value; var pos = value.indexOf("."); var result; if (pos !== -1) { var part1 = value.substr(0, pos); var part2 = value.substr(pos); result = part1 + part2.replace(part2,".5") $('input').val(result); } }); function isNumberKey(evt) { var charCode = (evt.which) ? evt.which : evt.keyCode; if (charCode != 46 && charCode > 31 && (charCode < 48 || charCode > 57)) return false; return true; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="number" name='days' class="w3-input w3-padding-tiny" id="cntday" onkeypress="return isNumberKey(event)" placeholder="Enter days"/>
Use this 用这个
$('#cntday').keyup(function() {
if(this.value %1 != 0.5){
this.value = this.value - this.value%1 + 0.5;
}
});
The condition checks whether a decimal has been entered or not and as soon as a decimal is entered and a number is entered it changes it to .5 It fulfills both the requirements you mentioned. 该条件检查是否输入了十进制数,并且一旦输入了十进制数并输入了数字,便将其更改为.5。它满足您提到的两个要求。 Check it here https://jsfiddle.net/xn0koawx/
在这里检查https://jsfiddle.net/xn0koawx/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.