什么是限制“数字”仅输入文本框的最佳方法?
我在找一些允许小数点的东西。
我看到很多这样的例子。但还没决定用哪一种。
Praveen Jeganathan报道
不再有插件,jQuery在1.7版本中实现了自己的jQuery. isnumeric()。 参见:https://stackoverflow.com/a/20186188/66767
什么是限制“数字”仅输入文本框的最佳方法?
我在找一些允许小数点的东西。
我看到很多这样的例子。但还没决定用哪一种。
Praveen Jeganathan报道
不再有插件,jQuery在1.7版本中实现了自己的jQuery. isnumeric()。 参见:https://stackoverflow.com/a/20186188/66767
当前回答
你看不到字母的神奇出现和消失的关键下来。这也适用于鼠标粘贴。
$('#txtInt').bind('input propertychange', function () {
$(this).val($(this).val().replace(/[^0-9]/g, ''));
});
其他回答
这很简单,我们已经有一个javascript内置函数“isNaN”在那里。
$("#numeric").keydown(function(e){
if (isNaN(String.fromCharCode(e.which))){
return false;
}
});
最好的方法是在文本框失去焦点时检查它的上下文。
可以使用正则表达式检查内容是否为“数字”。
或者你也可以使用Validation插件,它基本上会自动完成。
根据CanIUse的数据,截至2015年10月,HTML5支持输入类型数字,全球浏览器的支持度高达88%以上。
<input type="number" step="0.01" min="0" name="askedPrice" id="askedPrice" />
这不是JQuery相关的解决方案,但优点是在手机上的Android键盘会对输入数字进行优化。
或者,也可以使用带有新参数"pattern"的输入类型文本。更多细节在HTML5规范。
我认为它比jquery解决方案更好,因为在这个问题中提供的jquery解决方案不支持千位分隔符。如果你能使用html5。
JSFiddle: https://jsfiddle.net/p1ue8qxj/
保持插入符号在输入中的位置的其他方法:
$(document).ready(function() {
$('.numbersOnly').on('input', function() {
var position = this.selectionStart - 1;
fixed = this.value.replace(/[^0-9\.]/g, ''); //remove all but number and .
if(fixed.charAt(0) === '.') //can't start with .
fixed = fixed.slice(1);
var pos = fixed.indexOf(".") + 1;
if(pos >= 0)
fixed = fixed.substr(0,pos) + fixed.slice(pos).replace('.', ''); //avoid more than one .
if (this.value !== fixed) {
this.value = fixed;
this.selectionStart = position;
this.selectionEnd = position;
}
});
});
优点:
用户可以使用方向键、退格键、删除键、… 当你想要粘贴数字的时候就可以了
Plunker:演示工作
jquery。数值插件有一些bug,我通知了作者。它允许在Safari和Opera中使用多个小数点,而在Opera中不能输入退格键、方向键或其他几个控制字符。我需要正整数输入,所以最后我自己写了。
$(".numeric").keypress(function(event) {
// Backspace, tab, enter, end, home, left, right
// We don't support the del key in Opera because del == . == 46.
var controlKeys = [8, 9, 13, 35, 36, 37, 39];
// IE doesn't support indexOf
var isControlKey = controlKeys.join(",").match(new RegExp(event.which));
// Some browsers just don't raise events for control keys. Easy.
// e.g. Safari backspace.
if (!event.which || // Control keys in most browsers. e.g. Firefox tab is 0
(49 <= event.which && event.which <= 57) || // Always 1 through 9
(48 == event.which && $(this).attr("value")) || // No 0 first digit
isControlKey) { // Opera assigns values for control keys.
return;
} else {
event.preventDefault();
}
});