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 二维数组的实现与应用
Mar 16 Javascript
为jQuery增加join方法的实现代码
Nov 28 Javascript
Javascript的各种节点操作实例演示代码
Jun 27 Javascript
js网页中的(运行代码)功能实现思路
Feb 04 Javascript
Javascript仿PHP $_GET获取URL中的参数
May 12 Javascript
jQuery基于BootStrap样式实现无限极地区联动
Aug 26 Javascript
jQuery 选择器(61种)整理总结
Sep 26 Javascript
vue.js实现含搜索的多种复选框(附源码)
Mar 23 Javascript
angular实现spa单页面应用实例
Jul 10 Javascript
bootstrap datetimepicker控件位置异常的解决方法
Nov 23 Javascript
select标签设置默认选中的选项方法
Mar 02 Javascript
Express的HTTP重定向到HTTPS的方法
Jun 06 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教程 变量定义
2009/10/23 PHP
php array_walk() 数组函数
2011/07/12 PHP
php实现获取文章内容第一张图片的方法
2014/11/04 PHP
PHP多文件上传类实例
2015/03/07 PHP
WIN8.1下搭建PHP5.6环境
2015/04/29 PHP
基于ThinkPHP+uploadify+upload+PHPExcel 无刷新导入数据
2015/09/23 PHP
基于jquery的blockui插件显示弹出层
2011/04/14 Javascript
php和js对数据库图片进行等比缩放示例
2014/04/28 Javascript
node.js中的fs.writeFileSync方法使用说明
2014/12/14 Javascript
Javascript URI 解析介绍
2015/03/15 Javascript
AngularJS教程之简单应用程序示例
2016/08/16 Javascript
轻松掌握JavaScript代理模式
2016/08/26 Javascript
jQuery中show与hide方法用法示例
2016/09/16 Javascript
JS处理数据四舍五入(tofixed与round的区别详解)
2017/10/26 Javascript
angular中两种表单的区别(响应式和模板驱动表单)
2018/12/06 Javascript
CKeditor富文本编辑器使用技巧之添加自定义插件的方法
2019/06/14 Javascript
微信小程序 textarea 层级过高问题简单解决方案
2019/10/14 Javascript
js Math数学简单使用操作示例
2020/03/13 Javascript
JavaScript 禁止用户保存图片的实现代码
2020/04/28 Javascript
[02:49]2014DOTA2电竞也是体育项目! 势要把荣誉带回中国!
2014/07/20 DOTA
跟老齐学Python之字典,你还记得吗?
2014/09/20 Python
python简单实现基于SSL的IRC bot实例
2015/06/15 Python
Python设计模式之工厂模式简单示例
2018/01/09 Python
pycharm 配置远程解释器的方法
2018/10/28 Python
对web.py设置favicon.ico的方法详解
2018/12/04 Python
使用python写的opencv实时监测和解析二维码和条形码
2019/08/14 Python
解决python多行注释引发缩进错误的问题
2019/08/23 Python
使用Pytorch来拟合函数方式
2020/01/14 Python
解决pytorch多GPU训练保存的模型,在单GPU环境下加载出错问题
2020/06/23 Python
HTML5+Canvas+CSS3实现齐天大圣孙悟空腾云驾雾效果
2016/04/26 HTML / CSS
澳大利亚家居用品零售商:Harris Scarfe
2020/10/10 全球购物
信息专业本科生个人的自我评价
2013/10/28 职场文书
调解协议书
2014/04/16 职场文书
2015年乡镇党务公开工作总结
2015/05/19 职场文书
教师师德承诺书2016
2016/03/25 职场文书
MySQL表的增删改查基础教程
2021/04/07 MySQL