js实现文本框只允许输入数字并限制数字大小的方法


Posted in Javascript onAugust 19, 2015

本文实例讲述了js实现文本框只允许输入数字并限制数字大小的方法。分享给大家供大家参考。具体如下:

这是一个很个性的输入框特效,规定文本框只允许输入数字,如果你执意要输入其它的字符,则输入的字符将自动消失,除非你输入的是规定内的字符格式,并且对输入数字大小也有限制!为保证兼容性,请使用火狐浏览器。

运行效果截图如下:

js实现文本框只允许输入数字并限制数字大小的方法

在线演示地址如下:

具体代码如下:

<!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>
<meta http-equiv="X-UA-Compatible" content="IE=7" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>首页</title>
<style type="text/css">
html,body{margin:0; padding:20px;}
</style>
</head>
<body>
<input type="text" id="input" />
<script type="text/javascript">
var text = document.getElementById("input");
text.onkeyup = function(){
this.value=this.value.replace(/\D/g,'');
if(text.value>100){
  text.value = 100;
}
}
</script>
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
js实现兼容IE和FF的上下层的移动
May 04 Javascript
JavaSciprt中处理字符串之sup()方法的使用教程
Jun 08 Javascript
js性能优化技巧
Nov 29 Javascript
封装属于自己的JS组件
Jan 27 Javascript
jquery制做精致的倒计时特效
Jun 13 Javascript
jQuery on()方法绑定动态元素的点击事件实例代码浅析
Jun 16 Javascript
easyui combogrid实现本地模糊搜索过滤多列
May 13 Javascript
Ionic3 UI组件之Gallery Modal详解
Jun 07 Javascript
javascript获取指定区间范围随机数的方法
Sep 08 Javascript
基于vue cli 通过命令行传参实现多环境配置
Jul 12 Javascript
浅谈KOA2 Restful方式路由初探
Mar 14 Javascript
Angular利用HTTP POST下载流文件的步骤记录
Jul 26 Javascript
Jquery基础教程之DOM操作
Aug 19 #Javascript
jquery小火箭返回顶部代码分享
Aug 19 #Javascript
JS简单实现城市二级联动选择插件的方法
Aug 19 #Javascript
js实现当前输入框高亮显示的方法
Aug 19 #Javascript
jQuery实现的仿select功能代码
Aug 19 #Javascript
text-align:justify实现文本两端对齐 兼容IE
Aug 19 #Javascript
JS实现仿新浪微博发布内容为空时提示功能代码
Aug 19 #Javascript
You might like
打造计数器DIY三步曲(中)
2006/10/09 PHP
PHP调试函数和日志记录函数分享
2015/01/31 PHP
php随机获取金山词霸每日一句的方法
2015/07/09 PHP
如何打开php的gd2库
2017/02/09 PHP
PHP设计模式入门之迭代器模式原理与实现方法分析
2020/04/26 PHP
javascript脚本编程解决考试分数统计问题
2008/10/18 Javascript
jQuery 性能优化指南(3)
2009/05/21 Javascript
经典海量jQuery插件 大家可以收藏一下
2010/02/07 Javascript
IE事件对象(The Internet Explorer Event Object)
2012/06/27 Javascript
AngularJS中如何使用$parse或$eval在运行时对Scope变量赋值
2016/01/25 Javascript
jquery UI Datepicker时间控件的使用及问题解决
2016/04/28 Javascript
SpringBoot+Vue前后端分离,使用SpringSecurity完美处理权限问题的解决方法
2018/01/09 Javascript
webstorm和.vue中es6语法报错的解决方法
2018/05/08 Javascript
基于Vue 服务端Cookies删除的问题
2018/09/21 Javascript
基于javascript处理二进制图片流过程详解
2020/06/08 Javascript
Vue解决移动端弹窗滚动穿透问题
2020/12/15 Vue.js
python 文件操作删除某行的实例
2017/09/04 Python
tensorflow 打印内存中的变量方法
2018/07/30 Python
浅谈Pandas:Series和DataFrame间的算术元素
2018/12/22 Python
Python 如何提高元组的可读性
2019/08/26 Python
通过实例学习Python Excel操作
2020/01/06 Python
pytorch-神经网络拟合曲线实例
2020/01/15 Python
Python多线程thread及模块使用实例
2020/04/28 Python
草莓网化妆品加拿大网站:Strawberrynet Canada
2016/09/20 全球购物
应届生自我鉴定
2013/12/11 职场文书
法律专业学生的自我评价
2014/02/07 职场文书
中学生运动会入场词
2014/02/12 职场文书
老龄工作先进事迹
2014/08/15 职场文书
教师正风肃纪剖析材料
2014/10/20 职场文书
拾金不昧表扬信
2015/01/16 职场文书
小学教师年度个人总结
2015/02/05 职场文书
医药公司开票员岗位职责
2015/04/15 职场文书
Java 数组内置函数toArray详解
2021/06/28 Java/Android
Python编程编写完善的命令行工具
2021/09/15 Python
MySQL高级进阶sql语句总结大全
2022/03/16 MySQL
DSP接收机前端设想
2022/04/05 无线电