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 相关文章推荐
爱恋千雪-US-AscII加密解密工具(网页加密)下载
Jun 06 Javascript
js 页面传参数时 参数值含特殊字符的问题
Dec 13 Javascript
jquery插件开发方法(初学者)
Feb 03 Javascript
JavaScript组合拼接字符串的效率对比测试
Nov 06 Javascript
JavaScript中pop()方法的使用教程
Jun 09 Javascript
JavaScript易错知识点整理
Dec 05 Javascript
node安装--linux下的快速安装教程
Mar 21 Javascript
微信小程序基于picker实现级联菜单
Feb 15 Javascript
Vue源码解析之数据响应系统的使用
Apr 24 Javascript
详解如何给React-Router添加路由页面切换时的过渡动画
Apr 25 Javascript
微信小程序设置滚动条过程详解
Jul 25 Javascript
element tree树形组件回显数据问题解决
Aug 14 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
绿山咖啡和蓝山咖啡
2021/03/04 新手入门
用PHP和ACCESS写聊天室(一)
2006/10/09 PHP
windows下安装php的memcache模块的方法
2015/04/07 PHP
php判断用户是否关注微信公众号
2016/07/22 PHP
php使用glob函数遍历文件和目录详解
2016/09/23 PHP
网站被恶意镜像怎么办 php一段代码轻松搞定(全面版)
2018/10/23 PHP
Yii2框架自定义验证规则操作示例
2019/02/08 PHP
javaScript - 如何引入js代码
2021/03/09 Javascript
javascript实现仿银行密码输入框效果的代码
2007/12/13 Javascript
javascript 显示当前系统时间代码
2009/12/28 Javascript
JavaScript mapreduce工作原理简析
2012/11/25 Javascript
javascript重复绑定事件造成的后果说明
2013/03/02 Javascript
jQuery中.live()方法的用法深入解析
2013/12/30 Javascript
jQuery遍历json中多个map的方法
2015/02/12 Javascript
jquery实现用户信息修改验证输入方法汇总
2015/07/18 Javascript
Grunt入门教程(自动任务运行器)
2015/08/06 Javascript
基于angularJS的表单验证指令介绍
2016/10/21 Javascript
vue中子组件的methods中获取到props中的值方法
2018/08/27 Javascript
Javascript实现鼠标移入方向感知
2020/06/24 Javascript
React 条件渲染最佳实践小结(7种)
2020/09/27 Javascript
[01:37]全新的一集《真视界》——TI7总决赛
2017/09/21 DOTA
[01:08:48]LGD vs OG 2018国际邀请赛淘汰赛BO3 第三场 8.25
2018/08/29 DOTA
六个窍门助你提高Python运行效率
2015/06/09 Python
详解Python的collections模块中的deque双端队列结构
2016/07/07 Python
python实现括号匹配的思路详解
2018/08/23 Python
python dataframe向下向上填充,fillna和ffill的方法
2018/11/28 Python
Python如何实现FTP功能
2020/05/28 Python
keras中的History对象用法
2020/06/19 Python
使用Python+Appuim 清理微信的方法
2021/01/26 Python
使用css3实现超炫的loading加载动画效果
2014/05/07 HTML / CSS
历史系毕业生自荐信
2013/10/28 职场文书
幼儿园家长评语
2014/02/10 职场文书
销售人员职业生涯规划范文
2014/03/01 职场文书
地理教师岗位职责
2014/03/16 职场文书
企业安全生产目标责任书
2014/07/23 职场文书
暑期培训班策划方案
2014/08/26 职场文书