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 相关文章推荐
QQ邮箱的一个文本编辑器代码
Mar 14 Javascript
offsetHeight在OnLoad中获取为0的现象
Jul 22 Javascript
关于img的href和src取变量及赋值的方法
Apr 28 Javascript
jquery+json实现动态商品内容展示的方法
Jan 14 Javascript
jquery分隔Url的param方法(推荐)
May 25 Javascript
js添加千分位的实现代码(超简单)
Aug 01 Javascript
bootstrap datetimepicker2.3.11时间插件使用
Nov 19 Javascript
Vue 项目中遇到的跨域问题及解决方法(后台php)
Mar 28 Javascript
Vue 获取数组键名的方法
Jun 21 Javascript
傻瓜式解读koa中间件处理模块koa-compose的使用
Oct 30 Javascript
详解vue中的computed的this指向问题
Dec 05 Javascript
详解Nuxt.js 实战集锦
Nov 19 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生成zip压缩文件的方法详解
2013/06/09 PHP
删除html标签得到纯文本可处理嵌套的标签
2014/04/28 PHP
PHP的fsockopen、pfsockopen函数被主机商禁用的解决办法
2014/07/08 PHP
ThinkPHP实现二级循环读取的方法
2014/11/03 PHP
推荐dojo学习笔记
2007/03/24 Javascript
JS 添加千分位与去掉千分位的示例
2013/07/11 Javascript
js/jQuery简单实现选项卡功能
2014/01/02 Javascript
IE下双击checkbox反应延迟问题的解决方法
2014/03/27 Javascript
一个JS函数搞定网页标题(title)闪动效果
2014/05/13 Javascript
js脚本获取webform服务器控件的方法
2014/05/16 Javascript
js调试系列 源码定位与调试[基础篇]
2014/06/18 Javascript
javascript实现淘宝幻灯片广告展示效果
2015/04/27 Javascript
javascript检查浏览器是否已经启用XX功能
2015/07/10 Javascript
轻松使用jQuery双向select控件Bootstrap Dual Listbox
2015/12/13 Javascript
Websocket协议详解及简单实例代码
2016/12/12 Javascript
如何编写jquery插件
2017/03/29 jQuery
JQuery Ajax 异步操作之动态添加节点功能
2017/05/24 jQuery
React Native之ListView实现九宫格效果的示例
2017/08/02 Javascript
vue-cli开发时,关于ajax跨域的解决方法(推荐)
2018/02/03 Javascript
Angular 数据请求的实现方法
2018/05/07 Javascript
使用vue打包时vendor文件过大或者是app.js文件很大的问题
2018/06/29 Javascript
jquery获取select选中值的文本,并赋值给另一个输入框的方法
2018/08/21 jQuery
在小程序Canvas中使用measureText的方法示例
2018/10/19 Javascript
Vue.js 中的 v-show 指令及用法详解
2018/11/19 Javascript
详解VS Code使用之Vue工程配置format代码格式化
2019/03/20 Javascript
[04:40]2016国际邀请赛中国区预选赛全程TOP10镜头集锦
2016/07/01 DOTA
利用Python将每日一句定时推送至微信的实现方法
2018/08/13 Python
Python3 Post登录并且保存cookie登录其他页面的方法
2018/12/28 Python
Python异常原理及异常捕捉实现过程解析
2020/03/25 Python
在Ubuntu中安装并配置Pycharm教程的实现方法
2021/01/06 Python
python-jwt用户认证食用教学的实现方法
2021/01/19 Python
西班牙购买行李箱和背包网站:Maletas Greenwich
2019/10/08 全球购物
汽车维修工岗位职责
2014/02/12 职场文书
健康证明
2015/06/19 职场文书
2017寒假社会实践心得体会范文
2016/01/14 职场文书
Win7/8.1用户可以免费升级到Windows 11系统吗?
2021/11/21 数码科技