javascript 如何防止用户输入小数？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7279047/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to prevent user from entering decimals?
提问by hawkeye
I've got an order page on my site. Some order items can have decimal quantities, some can't.
我的网站上有一个订购页面。有些订单项目可以有十进制数量，有些则不能。
What's the best way to prevent the user from entering decimal quantities? (Apart from an alert box and setting the field to zero)?
防止用户输入十进制数量的最佳方法是什么？（除了警报框并将字段设置为零）？
回答by jfriend00
Intercept key events for the field, detect illegal characters upon input, keep them from getting entered in the field and add a temporary msg near the field (inserted into the page) that explains what characters or values are allowed. pop up alerts are a bad way to give feedback in the middle of typing.
拦截字段的关键事件，在输入时检测非法字符，防止它们被输入到字段中，并在字段附近添加一个临时 msg（插入页面），解释允许哪些字符或值。弹出警报是在打字过程中提供反馈的一种糟糕方式。
Then, validate again before submission because there are other ways to get data into fields (drag/drop, copy/paste, etc...) that you might not have caught everything.
然后，在提交之前再次验证，因为还有其他方法可以将数据放入字段（拖/放、复制/粘贴等）中，但您可能没有捕获所有内容。
Here's a jQuery example of both an integer only and a decimal only field with temporary messages displayed when invalid keys are typed:
这是一个 jQuery 示例，其中包含仅整数和仅小数字段，并在键入无效键时显示临时消息：
Working jsFiddle: http://jsfiddle.net/jfriend00/CkDTy/
工作 jsFiddle：http: //jsfiddle.net/jfriend00/CkDTy/
$(".integer").keypress(function(e) {
if (e.which < 48 || e.which > 57) {
showAdvice(this, "Integer values only");
return(false);
}
});
$(".decimal").keypress(function(e) {
// 46 is a period
if (e.which != 46 && (e.which < 48 || e.which > 57)) {
showAdvice(this, "Decimal numbers only");
return(false);
}
if (e.which == 46 && this.value.indexOf(".") != -1) {
showAdvice(this, "Only one period allowed in decimal numbers");
return(false); // only one decimal allowed
}
});
function showAdvice(obj, msg) {
$("#singleAdvice").stop(true, false).remove();
$('<span id="singleAdvice" class="advice">' + msg + '</span>').insertAfter(obj);
$("#singleAdvice").delay(4000).fadeOut(1500);
}
回答by attack
Here's a little jQuery that prevents non-numerical inputs:
这是一个防止非数字输入的小 jQuery：
$(function() {
$('input').bind('keyup', function(event) {
var currValue = $(this).val();
if(currValue.search(/[^0-9]/) != -1)
{
// Change this to something less obnoxious
alert('Only numerical inputs please');
}
$(this).val(currValue.replace(/[^0-9]/, ''));
});
});
回答by K''
You can add an event (on key press) and detect if a decimal point has been pressed by the user or not. Also on form submission, use regular expressions to check if the submitted data is correct (because the user can forge the data using live editor like firebug). Also make sure to double check that on your server side in case if user disabled javascript.
您可以添加一个事件（在按键时）并检测用户是否按下了小数点。同样在表单提交时，使用正则表达式来检查提交的数据是否正确（因为用户可以使用像 firebug 这样的实时编辑器来伪造数据）。还要确保在您的服务器端仔细检查，以防万一用户禁用了 javascript。
for example:
例如：
<input type="text" onkeypress="checkDecimal();" />
<input type="submit" onclick="checkBeforeSubmit();" />
function checkDecimal() {
// your code goes here
}
function checkBeforeSubmit() {
// your code goes here
}
You better to use the same function cause it's basically the same thing and invoke it from both events.
您最好使用相同的函数，因为它基本上是相同的，并从两个事件中调用它。
On server side, check the submitted data again
在服务器端，再次检查提交的数据
