jQuery实现只允许输入数字和小数点的方法


Posted in Javascript onMarch 02, 2016

本文实例讲述了jQuery实现只允许输入数字和小数点的方法。分享给大家供大家参考,具体如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
//示例代码:
//只允许输入数字与.:<input type="text" name="test" id="test" onkeydown="checkKeyForFloat(this.value,event)" style="ime-mode: disabled" />
//只允许输入数字 :<input type="text" name="test2" id="test2" onkeydown="checkKeyForNum(this.value,event)" style="ime-mode: disabled" />
//只允许输入数字与小数点
function checkKeyForFloat(value, e) {
 var isOK = false;
 var key = window.event ? e.keyCode : e.which;
 if ((key > 95 && key < 106) || //小键盘上的0到9
 (key > 47 && key < 60) || //大键盘上的0到9
 (key == 110 && value.indexOf(".") < 0) || //小键盘上的.而且以前没有输入.
 (key == 190 && value.indexOf(".") < 0) || //大键盘上的.而且以前没有输入.
 key == 8 || key == 9 || key == 46 || key == 37 || key == 39 //不影响正常编辑键的使用(8:BackSpace;9:Tab;46:Delete;37:Left;39:Right)
) {
  isOK = true;
 } else {
  if (window.event) //IE
  {
   e.returnValue = false; //event.returnValue=false 效果相同.
  }
  else //Firefox
  {
   e.preventDefault();
  }
 }
 return isOK;
}
//只允许输入数字
function checkKeyForInt(value, e) {
 var isOK = false;
 var key = window.event ? e.keyCode : e.which;
 if ((key > 95 && key < 106) || //小键盘上的0到9
 (key > 47 && key < 60) || //大键盘上的0到9
 key == 8 || key == 9 || key == 46 || key == 37 || key == 39 //不影响正常编辑键的使用(8:BackSpace;9:Tab;46:Delete;37:Left;39:Right)
) {
  isOK = true;
 } else {
  if (window.event) //IE
  {
   e.returnValue = false; //event.returnValue=false 效果相同.
  }
  else //Firefox
  {
   e.preventDefault();
  }
 }
 return isOK;
}
//设置有自定义属性 dtype 的文本框 允许输入的范围
function setDType() {
 $(":text[dtype]").each(function () {
  var dtype = $(this).attr("dtype");
  var isOK = true;
  switch (dtype) {
   case "number":
    $(this).css("ime-mode", "disabled").keydown(function (event) {
     isOK = checkKeyForFloat($(this).val(), event);
     if (!isOK) {
      //$(this).SuperFocus("", 500);
     }
     return isOK;
    });
    break;
   default:
    break;
  }
 });
}
</script>
<script type="text/javascript">
$(function () {
 setDType();
});
</script>
</head>
<body>
年龄: <input type="text" maxlength="3" onkeydown="checkKeyForInt(this.value,event)" style="ime-mode: disabled"/><br />
身高:<input type="text" maxlength="5" dtype="number" />
</body>
</html>

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
js中关于String对象的replace使用详解
May 24 Javascript
jquery 与NVelocity 产生冲突的解决方法
Jun 13 Javascript
node.js中的fs.writeFile方法使用说明
Dec 14 Javascript
jquery操作select方法汇总
Feb 05 Javascript
深入解析JavaScript中函数的Currying柯里化
Mar 19 Javascript
JavaScript解八皇后问题的方法总结
Jun 12 Javascript
Angular2关于@angular/cli默认端口号配置的问题
Jul 15 Javascript
Vue中组件之间数据的传递的示例代码
Sep 08 Javascript
vue获取DOM元素并设置属性的两种实现方法
Sep 30 Javascript
微信小程序slider组件使用详解
Jan 31 Javascript
浅谈Vue中render中的h箭头函数
Nov 07 Javascript
vue动态循环出的多个select出现过的变为disabled(实例代码)
Nov 10 Javascript
jQuery Mobile开发中日期插件Mobiscroll使用说明
Mar 02 #Javascript
javascript求日期差的方法
Mar 02 #Javascript
基于JavaScript实现表单密码的隐藏和显示出来
Mar 02 #Javascript
jQuery判断浏览器并动态调整select宽度的方法
Mar 02 #Javascript
js实现不重复导入的方法
Mar 02 #Javascript
基于JavaScript实现智能右键菜单
Mar 02 #Javascript
JS简单实现String转Date的方法
Mar 02 #Javascript
You might like
PHP删除数组中特定元素的两种方法
2013/07/02 PHP
zend framework中使用memcache的方法
2016/03/04 PHP
phpcms的分类名称和类别名称的调用
2017/01/05 PHP
php基于自定义函数记录log日志方法
2017/07/21 PHP
jQuery向上遍历DOM树之parents(),parent(),closest()之间的区别
2013/12/02 Javascript
javascripit实现密码强度检测代码分享
2013/12/12 Javascript
JS控制输入框内字符串长度
2014/05/21 Javascript
node.js中的fs.statSync方法使用说明
2014/12/16 Javascript
Bootstrap每天必学之轮播(Carousel)插件
2016/04/25 Javascript
基于jquery实现三级下拉菜单
2016/05/10 Javascript
JS hashMap实例详解
2016/05/26 Javascript
浅谈JavaScript前端开发的MVC结构与MVVM结构
2016/06/03 Javascript
jQuery获取Table某列的值(推荐)
2017/03/03 Javascript
完美解决axios在ie下的兼容性问题
2018/03/05 Javascript
使用js实现将后台传入的json数据放在前台显示
2018/08/06 Javascript
vue axios 简单封装以及思考
2018/10/09 Javascript
vue使用transition组件动画效果的实例代码
2021/01/28 Vue.js
[08:47]DOTA2每周TOP10 精彩击杀集锦vol.6
2014/06/25 DOTA
Python中自定义函数的教程
2015/04/27 Python
python 读写、创建 文件的方法(必看)
2016/09/12 Python
Python实现小数转化为百分数的格式化输出方法示例
2017/09/20 Python
对Tensorflow中的矩阵运算函数详解
2018/07/27 Python
Django框架自定义session处理操作示例
2019/05/27 Python
Keras:Unet网络实现多类语义分割方式
2020/06/11 Python
新手常见Python错误及异常解决处理方案
2020/06/18 Python
分布式全文检索引擎ElasticSearch原理及使用实例
2020/11/14 Python
世界上最大的二手相机店:KEN
2017/05/17 全球购物
印度购物网站:TATA CLiQ
2017/11/23 全球购物
皇家阿尔伯特英国官方商店:Royal Albert骨瓷
2019/03/25 全球购物
Myprotein丹麦官网:欧洲第一运动营养品牌
2019/04/15 全球购物
在weblogic中发布ejb需涉及到哪些配置文件
2012/01/17 面试题
迎接领导欢迎词
2014/01/11 职场文书
益达广告词
2014/03/14 职场文书
毕业留言寄语大全
2014/04/10 职场文书
《夕阳真美》教学反思
2014/04/27 职场文书
员工评语范文
2014/12/31 职场文书