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 相关文章推荐
HTML中Select不用Disabled实现ReadOnly的效果
Apr 07 Javascript
jquery提示 &quot;object expected&quot;的解决方法
Dec 13 Javascript
jquery限制输入字数,并提示剩余字数实现代码
Dec 24 Javascript
javascript ajax 仿百度分页函数
Oct 29 Javascript
javascript密码强度校验代码(两种方法)
Aug 10 Javascript
jQuery给元素添加样式的方法详解
Dec 30 Javascript
JavaScript类型系统之正则表达式
Jan 05 Javascript
基于JavaScript实现鼠标向下滑动加载div的代码
Aug 31 Javascript
Vue中对比scoped css和css module的区别
May 17 Javascript
Vuex 单状态库与多模块状态库详解
Dec 11 Javascript
Vue.js实现tab切换效果
Jul 24 Javascript
微信小程序全局变量的设置、使用、修改过程解析
Sep 24 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 运行效率总结(提示程序速度)
2009/11/26 PHP
php 提速工具eAccelerator 配置参数详解
2010/05/16 PHP
php使用NumberFormatter格式化货币的方法
2015/03/21 PHP
php操作MongoDB类实例
2015/06/17 PHP
PHP合并数组+号和array_merge的区别
2015/06/25 PHP
TP5框架实现自定义分页样式的方法示例
2020/04/05 PHP
jQuery动画效果animate和scrollTop结合使用实例
2014/04/02 Javascript
JQuery中模拟image的ajaxPrefilter与ajaxTransport处理
2015/06/19 Javascript
jQuery实现彩带延伸效果的网页加载条loading动画
2015/10/29 Javascript
谈一谈javascript中继承的多种方式
2016/02/19 Javascript
jQuery实现的简单分页示例
2016/06/01 Javascript
AngularJS出现$http异步后台无法获取请求参数问题的解决方法
2016/11/03 Javascript
jQuery中Nicescroll滚动条插件的用法
2016/11/10 Javascript
JS跳转手机站url的若干注意事项
2017/10/18 Javascript
在vue中,v-for的索引index在html中的使用方法
2018/03/06 Javascript
js正则相关知识点专题
2018/05/10 Javascript
js删除对象/数组中null、undefined、空对象及空数组方法示例
2018/11/14 Javascript
JS 数组基本用法入门示例解析
2020/01/16 Javascript
javascript设计模式 ? 适配器模式原理与应用实例分析
2020/04/13 Javascript
python对url格式解析的方法
2015/05/13 Python
python实现的文件同步服务器实例
2015/06/02 Python
深入解析Python中的线程同步方法
2016/06/14 Python
Python实现完整的事务操作示例
2017/06/20 Python
python 提取key 为中文的json 串方法
2018/12/31 Python
python类中super() 的使用解析
2019/12/19 Python
PyTorch中torch.tensor与torch.Tensor的区别详解
2020/05/18 Python
房屋出售协议书
2014/04/10 职场文书
公司合作协议书范本
2014/04/18 职场文书
给校长的一封检讨书
2014/09/20 职场文书
个人职业及收入证明
2014/10/13 职场文书
出纳工作检讨书范文
2014/12/27 职场文书
工厂仓库管理员岗位职责
2015/04/09 职场文书
2015年个人实习工作总结
2015/05/28 职场文书
《小摄影师》教学反思
2016/02/18 职场文书
让人瞬间清醒的句子,句句经典,字字如金
2019/07/08 职场文书
CPU不支持Windows11系统怎么办
2021/11/21 数码科技