jquery限定文本框只能输入数字(整数和小数)


Posted in Javascript onJanuary 08, 2016

本文实例介绍了jquery限定文本框只能输入数字的详细代码,分享给大家供大家参考,具体内容如下

先来一段规定文本框只能够输入数字包括小数的jQuery代码:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="gb2312"> 
<title>三水点靠木</title> 
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
//文本框只能输入数字(包括小数),并屏蔽输入法和粘贴 
jQuery.fn.number=function(){
 this.bind("keypress",function(e){ 
 var code=(e.keyCode?e.keyCode:e.which); //兼容火狐 IE 
 //火狐下不能使用退格键 
 if(!$.browser.msie&&(e.keyCode==0x8)){return;} 
 if(this.value.indexOf(".")==-1){return (code >= 48 && code<= 57)||(code==46);}
 else{return code >= 48 && code<= 57} 
 }); 
 this.bind("paste",function(){return false;}); 
 this.bind("keyup",function(){
 if(this.value.slice(0,1) == ".")
 { 
  this.value = ""; 
 } 
 }); 
 this.bind("blur",function(){ 
 if(this.value.slice(-1) == ".")
 { 
  this.value = this.value.slice(0,this.value.length-1); 
 } 
 }); 
}; 
$(function(){ 
 $("#txt").number();
}); 
</script>
</head>
<body>
<input type="text" id="txt" />
</body>
</html>

2、jQuery如何规定文本框只能输入整数:
有时候文本框的内容只能够是数字,并且还只能够是整数,例如年龄,你不能够填写20.8岁,下面就通过代码实例介绍一下如何实现此功能,希望给需要的朋友带来帮助,代码如下:

<html> 
<head> 
<meta charset="gb2312"> 
<title>蚂蚁部落</title> 
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
//文本框只能输入数字(不包括小数),并屏蔽输入法和粘贴 
jQuery.fn.integer=function(){ 
 this.bind("keypress",function(e){ 
 var code=(e.keyCode?e.keyCode:e.which); //兼容火狐 IE 
 //火狐下不能使用退格键 
 if(!$.browser.msie&&(e.keyCode==0x8))
 { 
  return ; 
 } 
 return code >= 48 && code<= 57; 
 }); 
 this.bind("paste",function(){ 
 return false; 
 }); 
 this.bind("keyup",function(){ 
 if(/(^0+)/.test(this.value)) 
 { 
 this.value = this.value.replace(/^0*/,''); 
 } 
 }); 
}; 
$(function(){ 
 $("#txt").integer();
}); 
</script>
</head>
<body>
<input type="text" id="txt" />
</body>
</html>

以上代码实现了我们的要求,文本框中只能够输入整数。

希望本文所述对大家学习jquery程序设计有所帮助。

Javascript 相关文章推荐
javascript XML数据显示为HTML一例
Dec 23 Javascript
JS无限树状列表实现代码
Jan 11 Javascript
ASP.NET jQuery 实例9  通过控件hyperlink实现返回顶部效果
Feb 03 Javascript
jquery事件与函数的使用介绍
Sep 29 Javascript
Javascript 5种方法实现过滤删除前后所有空格
Jun 22 Javascript
KVM虚拟化技术之使用Qemu-kvm创建和管理虚拟机的方法
Oct 05 Javascript
Async Validator 异步验证使用说明
Jul 03 Javascript
VUE 3D轮播图封装实现方法
Jul 03 Javascript
JS实现DOM节点插入操作之子节点与兄弟节点插入操作示例
Jul 30 Javascript
JavaScript队列结构Queue实现过程解析
Mar 07 Javascript
JS forEach跳出循环2种实现方法
Jun 24 Javascript
vue界面发送表情的实现代码
Sep 11 Javascript
jQuery实现的鼠标滑过弹出放大图片特效
Jan 08 #Javascript
jQuery鼠标悬浮链接弹出跟随图片实例代码
Jan 08 #Javascript
javascript中select下拉框的用法总结
Jan 07 #Javascript
详解JS中Array对象扩展与String对象扩展
Jan 07 #Javascript
js创建对象的方法汇总
Jan 07 #Javascript
JavaScript截取、切割字符串的技巧
Jan 07 #Javascript
js确认框confirm()用法实例详解
Jan 07 #Javascript
You might like
PHP 数组和字符串互相转换实现方法
2013/03/26 PHP
PHP开发工具ZendStudio下Xdebug工具使用说明详解
2013/11/11 PHP
PHP 如何获取二维数组中某个key的集合
2014/06/03 PHP
php实现redis数据库指定库号迁移的方法
2015/01/14 PHP
php用wangeditor3实现图片上传功能
2019/08/22 PHP
js基础知识(公有方法、私有方法、特权方法)
2015/11/06 Javascript
深入浅析javascript中的作用域(推荐)
2016/07/19 Javascript
完美解决JS文件页面加载时的阻塞问题
2016/12/18 Javascript
微信小程序 动态传参实例详解
2017/04/27 Javascript
详解angular 中的自定义指令之详解API
2017/06/20 Javascript
基于vue1和vue2获取dom元素的方法
2018/03/17 Javascript
vue生命周期实例小结
2018/08/15 Javascript
利用JS动态生成隔行换色HTML表格的两种方法
2018/10/09 Javascript
layui的面包屑或者表单不显示的解决方法
2019/09/05 Javascript
vue请求服务器数据后绑定不上的解决方法
2019/10/30 Javascript
Vue分页效果与购物车功能
2019/12/13 Javascript
[45:38]DOTA2上海特级锦标赛主赛事日 - 1 胜者组第一轮#1Liquid VS Alliance第一局
2016/03/02 DOTA
Python中字典创建、遍历、添加等实用操作技巧合集
2015/06/02 Python
Python实现多线程抓取妹子图
2015/08/08 Python
Python多进程分块读取超大文件的方法
2016/04/13 Python
Python 获取主机ip与hostname的方法
2018/12/17 Python
对python字典过滤条件的实例详解
2019/01/22 Python
Python获取二维数组的行列数的2种方法
2020/02/11 Python
Jupyter Notebook 实现正常显示中文和负号
2020/04/24 Python
BIBLOO捷克:购买女装、男装、童装、鞋和配件
2017/01/27 全球购物
POS解决方案:MUNBYN(热敏打印机、条形码扫描仪)
2020/06/09 全球购物
新学期开学演讲稿
2014/05/24 职场文书
学生自我鉴定格式及范文
2014/09/16 职场文书
医德医风个人工作总结2014
2014/11/14 职场文书
2014年物业管理工作总结
2014/11/21 职场文书
2014年内勤工作总结
2014/11/24 职场文书
党支部意见范文
2015/06/02 职场文书
2016春季运动会通讯稿
2015/07/18 职场文书
创业计划书之川味火锅店
2019/09/02 职场文书
导游词之河北白洋淀
2020/01/15 职场文书
html网页引入svg图片的4种方式
2022/08/05 HTML / CSS