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 撑出页面文字换行
Jun 15 Javascript
Mootools 1.2教程 Fx.Tween的使用
Sep 15 Javascript
jquery实现弹出层完美居中效果
Mar 03 Javascript
js检测浏览器版本、核心、是否移动端示例
Apr 24 Javascript
详解js闭包
Sep 02 Javascript
Javascript 数组排序详解
Oct 22 Javascript
jQuery中的编程范式详解
Dec 15 Javascript
jquery实现先淡出再折叠收起的动画效果
Aug 07 Javascript
ES6生成器用法实例分析
Apr 10 Javascript
详解使用Vue Router导航钩子与Vuex来实现后退状态保存
Sep 11 Javascript
详解React+Koa实现服务端渲染(SSR)
May 23 Javascript
基于Web Audio API实现音频可视化效果
Jun 12 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 水平的题目
2007/05/30 PHP
PHP 日常开发小技巧
2009/09/23 PHP
PHP下操作Linux消息队列完成进程间通信的方法
2010/07/24 PHP
用PHP实现小写金额转换大写金额的代码(精确到分)
2012/01/10 PHP
探讨php中防止SQL注入最好的方法是什么
2013/06/10 PHP
php实现cc攻击防御和防止快速刷新页面示例
2014/02/13 PHP
yii实现CheckBox复选框在同一行显示的方法
2014/12/03 PHP
示例详解Laravel的注册重构
2016/08/14 PHP
PHP编写daemon process 实例详解
2016/11/13 PHP
yii2.0整合阿里云oss删除单个文件的方法
2017/09/19 PHP
thinkphp 5框架实现登陆,登出及session登陆状态检测功能示例
2019/10/10 PHP
JavaScript OOP类与继承
2009/11/15 Javascript
javascript函数以及基础写法100多条实用整理
2013/01/13 Javascript
JS中的构造函数详细解析
2014/03/10 Javascript
javascript操作excel生成报表示例
2014/05/08 Javascript
js生成缩略图后上传并利用canvas重绘
2014/05/15 Javascript
IOS中safari下的select下拉菜单文字过长不换行的解决方法
2016/09/26 Javascript
详解ES6中的let命令
2020/04/05 Javascript
详谈$.data()的用法和作用
2017/02/13 Javascript
JS 实现随机验证码功能
2017/02/15 Javascript
微信小程序 同步请求授权的详解
2017/08/04 Javascript
JS实现提示框跟随鼠标移动
2019/08/27 Javascript
[54:56]DOTA2上海特级锦标赛主赛事日 - 5 总决赛Liquid VS Secret第三局
2016/03/06 DOTA
python八皇后问题的解决方法
2018/09/27 Python
详解用python自制微信机器人,定时发送天气预报
2019/03/25 Python
开启Django博客的RSS功能的实现方法
2020/02/17 Python
jupyter 导入csv文件方式
2020/04/21 Python
Django+Celery实现动态配置定时任务的方法示例
2020/05/26 Python
Python制作运行进度条的实现效果(代码运行不无聊)
2021/02/24 Python
CSS3 对过渡(transition)进行调速以及延时
2020/10/21 HTML / CSS
清除canvas画布内容(点擦除+线擦除)
2020/08/12 HTML / CSS
师范大学应届生求职信
2013/11/21 职场文书
地质工程专业毕业生求职信
2014/08/08 职场文书
2015年社区服务活动总结
2015/03/25 职场文书
《圆明园的毁灭》教学反思
2016/02/16 职场文书
Requests什么的通通爬不了的Python超强反爬虫方案!
2021/05/20 Python