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 相关文章推荐
Mootools 1.2教程 滑动效果(Slide)
Sep 15 Javascript
javascript数字数组去重复项的实现代码
Dec 30 Javascript
jQuery的Ajax的自动完成功能控件简要说明
Feb 22 Javascript
jQuery实现 注册时选择阅读条款 左右移动
Apr 11 Javascript
使用jquery.validate自定义方法实现&quot;手机号码或者固话至少填写一个&quot;的逻辑验证
Sep 01 Javascript
jquery.form.js实现将form提交转为ajax方式提交的方法
Apr 07 Javascript
jQuery层级选择器实例代码
Feb 06 Javascript
Vue keep-alive实践总结(推荐)
Aug 31 Javascript
jquery tmpl模板(实例讲解)
Sep 02 jQuery
让webpack+vue-cil项目不再自动打开浏览器的方法
Sep 27 Javascript
微信小程序可滑动月日历组件使用详解
Oct 21 Javascript
vue项目中的支付功能实现(微信支付和支付宝支付)
Feb 18 Vue.js
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面向对象三大特点学习(充分理解抽象、封装、继承、多态)
2012/05/07 PHP
php使用PDO执行SQL语句的方法分析
2017/02/16 PHP
PHP get_html_translation_table()函数用法讲解
2019/02/16 PHP
使用PHPWord生成word文档的方法详解
2019/06/06 PHP
下载站控制介绍字数显示的脚本 显示全部 隐藏介绍等功能
2009/09/19 Javascript
ExtJs扩展之GroupPropertyGrid代码
2010/03/05 Javascript
jQuery 幻灯片插件(带缩略图功能)
2011/01/24 Javascript
javascript插入样式实现代码
2012/02/22 Javascript
JavaScript实现简单图片滚动附源码下载
2014/06/17 Javascript
js使用正则实现ReplaceAll全部替换的方法
2014/07/18 Javascript
纯javascript实现的小游戏《Flappy Pig》实例
2015/07/27 Javascript
JavaScript实现可拖拽的拖动层Div实例
2015/08/05 Javascript
javascript图片预加载完整实例
2015/12/10 Javascript
jQuery实现图片轮播效果代码(基于jquery.pack.js插件)
2016/06/02 Javascript
推荐三款不错的图片压缩上传插件(webuploader、localResizeIMG4、LUploader)
2017/04/21 Javascript
angular中使用Socket.io实例代码
2017/06/03 Javascript
JavaScript该如何学习 怎样轻松学习JavaScript
2017/06/12 Javascript
JS处理数据四舍五入(tofixed与round的区别详解)
2017/10/26 Javascript
nodejs实现解析xml字符串为对象的方法示例
2018/03/14 NodeJs
Weex开发之WEEX-EROS开发踩坑(小结)
2019/10/16 Javascript
微信小程序开发之转发分享功能
2019/10/22 Javascript
微信小程序实用代码段(收藏版)
2019/12/17 Javascript
JavaScript 严格模式(use strict)用法实例分析
2020/03/04 Javascript
[01:02:48]2018DOTA2亚洲邀请赛小组赛 A组加赛 Newbee vs Liquid
2018/04/03 DOTA
Python中使用装饰器和元编程实现结构体类实例
2015/01/28 Python
python实现查询苹果手机维修进度
2015/03/16 Python
numpy自动生成数组详解
2017/12/15 Python
Python中Threading用法详解
2017/12/27 Python
numpy返回array中元素的index方法
2018/06/27 Python
在cmd中查看python的安装路径方法
2019/07/03 Python
英国手机壳购买网站:Case Hut
2019/04/11 全球购物
英国儿童鞋和靴子:Start-Rite
2019/05/06 全球购物
单位实习证明怎么写
2014/01/17 职场文书
政法学院毕业生求职信
2014/02/28 职场文书
六一儿童节主持开场白
2015/05/28 职场文书
mysql获取指定时间段中所有日期或月份的语句(不设存储过程,不加表)
2021/06/18 MySQL