小编典典

jQuery:限制文本框仅输入“数字”的最佳方法是什么?(允许小数点)

all

限制文本框仅输入“数字”的最佳方法是什么?

我正在寻找允许小数点的东西。

我看到很多例子。但尚未决定使用哪一个。

来自 Praveen Jeganathan 的更新

没有更多的插件,jQuery 在 v1.7 中实现了自己的jQuery.isNumeric()添加。请参阅:

没有更多的插件,jQuery已经实现了自己在 v1.7 中添加的jQuery.isNumeric()

jQuery.isNumeric( value )

确定其参数是否为数字。

样品结果

$.isNumeric( "-10" );     // true
$.isNumeric( 16 );        // true
$.isNumeric( 0xFF );      // true
$.isNumeric( "0xFF" );    // true
$.isNumeric( "8e5" );     // true (exponential notation string)
$.isNumeric( 3.1415 );    // true
$.isNumeric( +10 );       // true
$.isNumeric( 0144 );      // true (octal integer literal)
$.isNumeric( "" );        // false
$.isNumeric({});          // false (empty object)
$.isNumeric( NaN );       // false
$.isNumeric( null );      // false
$.isNumeric( true );      // false
$.isNumeric( Infinity );  // false
$.isNumeric( undefined ); // false

这是一个如何将 isNumeric() 与事件侦听器绑定的示例

$(document).on('keyup', '.numeric-only', function(event) {
   var v = this.value;
   if($.isNumeric(v) === false) {
        //chop off the last char entered
        this.value = this.value.slice(0,-1);
   }
});

阅读 70

收藏
2022-06-01

共1个答案

小编典典

更新

有一个新的非常简单的解决方案:

它允许您对文本使用 任何
类型的输入过滤器<input>,包括各种数字过滤器。这将正确处理复制+粘贴、拖放、键盘快捷键、上下文菜单操作、不可键入的键和所有键盘布局。

请参阅此答案在 JSFiddle
上自行
尝试。

jquery.numeric 插件

我已经使用jquery.numeric插件成功实现了许多表单。

$(document).ready(function(){
    $(".numeric").numeric();
});

此外,这也适用于 textareas!

但是,请注意 Ctrl+A、Copy+Paste(通过上下文菜单)和 Drag+Drop 不会 按预期工作。

HTML 5

随着对 HTML 5 标准的更广泛支持,我们可以使用元素的pattern属性和number类型input来限制仅输入数字。在某些浏览器(尤其是
Google
Chrome)中,它也可以限制粘贴非数字内容。有关更多信息number和其他较新的输入类型,请参见此处

2022-06-01