微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

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

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

更新

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

它允许您对文本使用 类型的输入过滤器<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和其他较新的输入类型,请参见此处

解决方法

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

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

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

来自 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);
   }
});

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。