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 相关文章推荐
angularJS提交表单(form)
Feb 09 Javascript
jQuery实现点击后标记当前菜单位置(背景高亮菜单)效果
Aug 22 Javascript
基于JavaScript实现瀑布流效果(循环渐近)
Jan 27 Javascript
AngularJS ng-bind-html 指令详解及实例代码
Jul 30 Javascript
AngularJS入门教程之过滤器用法示例
Nov 02 Javascript
BootStrap栅格系统、表单样式与按钮样式源码解析
Jan 20 Javascript
JS查找字符串中出现最多的字符及个数统计
Feb 04 Javascript
js实现自动图片轮播代码
Mar 22 Javascript
原生js FileReader对象实现图片上传本地预览效果
Mar 27 Javascript
详解es6超好用的语法糖Decorator
Aug 01 Javascript
vue 取出v-for循环中的index值实例
Nov 09 Javascript
JavaScript回调函数callback用法解析
Jan 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
PHP也可以?成Shell Script
2006/10/09 PHP
PHP 应用程序的安全 -- 不能违反的四条安全规则
2006/11/26 PHP
php实现可以设置中奖概率的抽奖程序代码分享
2014/01/19 PHP
PHP实现XML与数据格式进行转换类实例
2015/07/29 PHP
php通过会话控制实现身份验证实例
2016/10/18 PHP
简单解决微信文章图片防盗链问题
2016/12/17 PHP
PHP _construct()函数讲解
2019/02/03 PHP
laravel 解决多库下的DB::transaction()事务失效问题
2019/10/21 PHP
一些有用的JavaScript和jQuery的片段分享
2011/08/23 Javascript
最短的javascript:地址栏载入脚本代码
2011/10/13 Javascript
jQuery Form 表单提交插件之formSerialize,fieldSerialize,fieldValue,resetForm,clearForm,clearFields的应用
2016/01/23 Javascript
微信小程序 实现tabs选项卡效果实例代码
2016/10/31 Javascript
在javaScript中检测数据类型的几种方式小结
2017/03/04 Javascript
温故知新——JavaScript中的字符串连接问题最全总结(推荐)
2017/08/21 Javascript
以v-model与promise两种方式实现vue弹窗组件
2018/05/21 Javascript
trackingjs+websocket+百度人脸识别API实现人脸签到
2018/11/26 Javascript
如何获取vue单文件自身源码路径
2019/05/06 Javascript
nodejs和react实现即时通讯简易聊天室功能
2019/08/21 NodeJs
layer关闭当前窗口页面以及确认取消按钮的方法
2019/09/09 Javascript
微信小程序实现上拉加载功能示例【加载更多数据/触底加载/点击加载更多数据】
2020/05/29 Javascript
JS实现按比例缩小图片宽高
2020/08/24 Javascript
[02:51]DOTA2战队出征照拍摄花絮 TI3明星化身时尚男模
2013/07/22 DOTA
[57:22]2018DOTA2亚洲邀请赛 4.7总决赛 LGD vs Mineski 第五场
2018/04/10 DOTA
python实现Dijkstra静态寻路算法
2019/01/17 Python
解决python tkinter界面卡死的问题
2019/07/17 Python
Pytorch加载部分预训练模型的参数实例
2019/08/18 Python
日本食品网上商店:JaponShop.com
2017/11/28 全球购物
俄罗斯电子产品在线商店:UltraTrade
2020/01/30 全球购物
跟单文员岗位职责
2014/01/03 职场文书
小学五年级学生评语
2014/04/22 职场文书
2015社区爱国卫生工作总结
2015/04/21 职场文书
社区禁毒宣传活动总结
2015/05/07 职场文书
礼貌问候语大全
2015/11/10 职场文书
关于社会实践的心得体会(2016最新版)
2016/01/25 职场文书
使用 Apache Dubbo 实现远程通信(微服务架构)
2022/02/12 Servers
MySQL详解进行JDBC编程与增删改查方法
2022/06/16 MySQL