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 相关文章推荐
javascript第一课
Feb 27 Javascript
javascript中验证大写字母、数字和中文
Jan 15 Javascript
Javascript基础知识盲点总结之函数
May 15 Javascript
浅谈jquery页面初始化的4种方式
Nov 27 Javascript
Vuejs 组件——props数据传递的实例代码
Mar 07 Javascript
angular-cli修改端口号【angular2】
Apr 19 Javascript
jQuery实现点击关注和取消功能
Jul 03 jQuery
AngularJS中的路由使用及实现代码
Oct 09 Javascript
使用Ajax和Jquery配合数据库实现下拉框的二级联动的示例
Jan 25 jQuery
通过封装scroll.js 获取滚动条的值
Jul 13 Javascript
微信小程序使用for循环动态渲染页面操作示例
Dec 25 Javascript
使用jQuery mobile NuGet让你的网站在移动设备上同样精彩
Jun 18 jQuery
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制作静态网站的模板框架(四)
2006/10/09 PHP
php获取一个变量的名字的方法
2014/09/05 PHP
div层的移动及性能优化
2010/11/16 Javascript
ASP.NET jQuery 实例3 (在TextBox里面阻止复制、剪切和粘贴事件)
2012/01/13 Javascript
JavaScript prototype属性深入介绍
2012/11/27 Javascript
js图片延迟加载的实现方法及思路
2013/07/22 Javascript
JavaScript按位运算符的应用简析
2014/02/04 Javascript
JavaScript获取图片的原始尺寸以宽度为例
2014/05/04 Javascript
jQuery 仿百度输入标签插件附效果图
2014/07/04 Javascript
浅析Node.js查找字符串功能
2014/09/03 Javascript
浅谈JavaScript函数节流
2014/12/09 Javascript
JQuery自动触发事件的方法
2015/06/13 Javascript
jQuery实现输入框下拉列表树插件特效代码分享
2015/08/27 Javascript
javascript 动态脚本添加的简单方法
2016/10/11 Javascript
JS实现简单拖拽效果
2017/06/21 Javascript
canvas+gif.js打造自己的数字雨头像的示例代码
2017/10/26 Javascript
AngularJS实现controller控制器间共享数据的方法示例
2017/10/30 Javascript
修改UA在PC中访问只能在微信中打开的链接方法
2017/11/27 Javascript
小程序获取当前位置加搜索附近热门小区及商区的方法
2019/04/08 Javascript
vue之a-table中实现清空选中的数据
2019/11/07 Javascript
python快速查找算法应用实例
2014/09/26 Python
python字符串替换的2种方法
2014/11/30 Python
python类的继承实例详解
2017/03/30 Python
python实现从pdf文件中提取文本,并自动翻译的方法
2018/11/28 Python
解决Python pandas plot输出图形中显示中文乱码问题
2018/12/12 Python
Python实现字符串匹配的KMP算法
2019/04/04 Python
Python函数装饰器原理与用法详解
2019/08/16 Python
Python中if有多个条件处理方法
2020/02/26 Python
Python 保存加载mat格式文件的示例代码
2020/08/04 Python
PyQt5的相对布局管理的实现
2020/08/07 Python
使用Python爬取小姐姐图片(beautifulsoup法)
2021/02/11 Python
房屋租赁协议书
2014/04/10 职场文书
大学生翘课检讨书范文
2014/10/06 职场文书
教师党员个人总结
2015/02/10 职场文书
保险公司反洗钱宣传活动总结
2015/05/08 职场文书
MySQL详解进行JDBC编程与增删改查方法
2022/06/16 MySQL