JS限制输入框输入的实现代码


Posted in Javascript onJuly 02, 2018

1.文本框只能输入数字代码(小数点也不能输入)

代码如下:

<input onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')">

2.只能输入数字,能输小数点.

代码如下:

<input onkeyup="if(isNaN(value))execCommand('undo')" onafterpaste="if(isNaN(value))execCommand('undo')">
<input name=txt1 onchange="if(/\D/.test(this.value)){alert('只能输入数字');this.value='';}">

3.数字和小数点方法二

代码如下:

<input type=text tvalue="" ovalue="" onkeypress="if(!this.value.match(/^[\+\-]?\d*?\.?\d*?$/))this.value=this.t_value;else this.tvalue=this.value;if(this.value.match(/^(?:[\+\-]?\d+(?:\.\d+)?)?$/))this.ovalue=this.value" onkeyup="if(!this.value.match(/^[\+\-]?\d*?\.?\d*?$/))this.value=this.t_value;else this.tvalue=this.value;if(this.value.match(/^(?:[\+\-]?\d+(?:\.\d+)?)?$/))this.ovalue=this.value" onblur="if(!this.value.match(/^(?:[\+\-]?\d+(?:\.\d+)?|\.\d*?)?$/))this.value=this.o_value;else{if(this.value.match(/^\.\d+$/))this.value=0+this.value;if(this.value.match(/^\.$/))this.value=0;this.ovalue=this.value}">

4.只能输入字母和汉字

代码如下:

<input onkeyup="value=value.replace(/[\d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[\d]/g,''))" maxlength=10 name="Numbers">

5.只能输入英文字母和数字,不能输入中文

代码如下:

<input onkeyup="value=value.replace(/[^\w\.\/]/ig,'')">

6.只能输入数字和英文<font color="Red">chun</font>

代码如下:

<input onKeyUp="value=value.replace(/[^\d|chun]/g,'')">

7.小数点后只能有最多两位(数字,中文都可输入),不能输入字母和运算符号:

代码如下:

<input onKeyPress="if((event.keyCode<48 || event.keyCode>57) && event.keyCode!=46 || /\.\d\d$/.test(value))event.returnValue=false">

8.小数点后只能有最多两位(数字,字母,中文都可输入),可以输入运算符号:

代码如下:

<input onkeyup="this.value=this.value.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3')">
//只能输入汉字: 
<input onkeyup="value=value.replace(/[^\u4E00-\u9FA5]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\u4E00-\u9FA5]/g,''))">
//只能输入数字: 
<input onkeyup="value=value.replace(/[^\d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))">
//只能输入英文和数字: 
<input onkeyup="value=value.replace(/[\W]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))">
//控制输入框只能输入文字或数字,也可以不允许输入特殊字符 
//这里不允许输入如下字符: (像 !@#$%^&* 等)<br> 
<textarea rows=2 cols=20 name=comments onKeypress="if ((event.keyCode > 32 && event.keyCode < 48) || (event.keyCode > 57 && event.keyCode < 65) || (event.keyCode > 90 && event.keyCode < 97)) event.returnValue = false;">
//只禁止空格输入 
onkeyup="value=value.replace(/\s/g,'')" 
//只能输入中文和英文: 
onkeyup="value=value.replace(/[^\a-zA-Z\u4E00-\u9FA5]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\a-zA-Z\u4E00-\u9FA5]/g,''))"

总结

以上所述是小编给大家介绍的JS限制输入框输入的实现代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JavaScript中的Document文档对象
Jan 16 Javascript
JSON 客户端和服务器端的格式转换
Aug 27 Javascript
checkbox全选/取消全选以及checkbox遍历jQuery实现代码
Dec 02 Javascript
从零开始学习jQuery (八) 插播:jQuery实施方案
Feb 23 Javascript
jquery选择符快速提取web表单数据示例
Mar 27 Javascript
json中换行符的处理方法示例介绍
Jun 10 Javascript
js读取cookie方法总结
Oct 31 Javascript
js事件处理程序跨浏览器解决方案
Mar 27 Javascript
JavaScript实现简单Tip提示框效果
Apr 20 Javascript
获取JS中网页各种高宽与位置的方法总结
Jul 27 Javascript
JS实现炫酷雪花飘落效果
Aug 19 Javascript
Vue实现鼠标经过文字显示悬浮框效果的示例代码
Oct 14 Javascript
webpack手动配置React开发环境的步骤
Jul 02 #Javascript
Angularjs中的$apply及优化使用详解
Jul 02 #Javascript
angularjs 的数据绑定实现原理
Jul 02 #Javascript
vue 解决addRoutes动态添加路由后刷新失效问题
Jul 02 #Javascript
vue中的数据绑定原理的实现
Jul 02 #Javascript
Vue实现双向绑定的原理以及响应式数据的方法
Jul 02 #Javascript
jsonp跨域获取数据的基础教程
Jul 01 #Javascript
You might like
PHP开发者常犯的10个MySQL错误更正剖析
2012/01/30 PHP
PHP实现将HTML5中Canvas图像保存到服务器的方法
2014/11/28 PHP
PHP实现RTX发送消息提醒的实例代码
2017/01/03 PHP
浅谈PHP的exec()函数无返回值排查方法(必看)
2017/03/31 PHP
PHP7实现和CryptoJS的AES加密方式互通示例【AES-128-ECB加密】
2019/06/08 PHP
JQuery团队打造的javascript单元测试工具QUnit介绍
2010/02/26 Javascript
js实现屏蔽默认快捷键调用自定义事件示例
2013/06/18 Javascript
vue.js中mint-ui框架的使用方法
2017/05/12 Javascript
React-Native中禁用Navigator手势返回的示例代码
2017/09/09 Javascript
移动端效果之IndexList详解
2017/10/20 Javascript
浅谈Angular 中何时取消订阅
2017/11/22 Javascript
Vue-路由导航菜单栏的高亮设置方法
2018/03/17 Javascript
JavaScript实现随机点名程序
2020/03/25 Javascript
Vue使用Three.js加载glTF模型的方法详解
2020/06/14 Javascript
python使用BeautifulSoup分页网页中超链接的方法
2015/04/04 Python
python访问mysql数据库的实现方法(2则示例)
2016/01/06 Python
剖析Python的Twisted框架的核心特性
2016/05/25 Python
python中数据爬虫requests库使用方法详解
2018/02/11 Python
python操作redis方法总结
2018/06/06 Python
详解Appium+Python之生成html测试报告
2019/01/04 Python
浅谈Python3 numpy.ptp()最大值与最小值的差
2019/08/24 Python
Python hashlib模块加密过程解析
2019/11/05 Python
解决Python列表字符不区分大小写的问题
2019/12/19 Python
解决Python3.8运行tornado项目报NotImplementedError错误
2020/09/02 Python
boostrap modal 闪现问题的解决方法
2020/09/01 HTML / CSS
自我鉴定书范文
2013/10/02 职场文书
企事业单位求职者的自我评价
2013/12/28 职场文书
竞争上岗演讲稿
2014/01/05 职场文书
公司庆典活动邀请函
2014/01/09 职场文书
餐饮部总监岗位职责范文
2014/02/13 职场文书
国际贸易求职信
2014/07/05 职场文书
招标授权委托书样本
2014/09/23 职场文书
2014年群众路线党员自我评议
2014/09/24 职场文书
乡村教师党员四风问题对照检查材料思想汇报
2014/10/08 职场文书
IDEA使用SpringAssistant插件创建SpringCloud项目
2021/06/23 Java/Android
Redis+Lua脚本实现计数器接口防刷功能(升级版)
2022/02/12 Redis