Vue正则表达式限制input的输入范围
更新时间：2023年12月13日 09:34:44 作者：Sun Peng
我们有时需要限制文本框输入内容的类型,本节分享下正则表达式限制文本框只能输入数字、小数点、英文字母、汉字等代码,感兴趣的朋友跟随小编一起看看吧
Vue正则表达式限制input的输入
<a-input type="text" onkeyup="value=value.replace(正则表达式,'')"> 如： <a-input type="text" onkeyup="value=value.replace(/[^\w_]/g,'')">
1、只能输入大小写字母、数字、下划线：/[^\w_]/g
2、只能输入小写字母、数字、下划线：/[^a-z0-9_]/g
3、只能输入数字和点：/[^\d.]/g
4、只能输入小写字母、数字、下划线：/[^\u4e00-\u9fa5]/g
5、只能输入数字：/\D/g
6、只能输入英文：/[^a-zA-Z]/g
7、只能输入中文、数字、英文：/[^\w\u4E00-\u9FA5]/g
8、只能输入数字和字母：/[\W]/g
9、除了英文的标点符号以外，其他的都可以：/[!@#$%^&*()-=+]/g
10、只能输入数字代码(小数点也不能输入)：/\D/g
<a-input onkeyup="value=value.replace(/\D/g,'')" onafterpaste="value=value.replace(/\D/g,'')"/>
11、只能输入数字，能输小数点：
<a-input onkeyup="if(isNaN(value))execCommand('undo')" onafterpaste="if(isNaN(value))execCommand('undo')"/>
或者：
<a-input onchange="if(/\D/.test(this.value)){alert('只能输入数字');this.value='';}"/>
或者：
<a-input type="text"
onkeypress="if(!this.value.match(/^[\+\-]?\d*?\.?\d*?$/))this.value=this.t_value;ase this.t_value=this.value;if(this.value.match(/^(?:[\+\-]?\d+(?:\.\d+)?)?$/))this.o_value=this.value"
onkeyup="if(!this.value.match(/^[\+\-]?\d*?\.?\d*?$/))this.value=this.t_value;ase this.t_value=this.value;if(this.value.match(/^(?:[\+\-]?\d+(?:\.\d+)?)?$/))this.o_value=this.value"
onblur="if(!this.value.match(/^(?:[\+\-]?\d+(?:\.\d+)?|\.\d*?)?$/))this.value=this.o_value;ase{if(this.value.match(/^\.\d+$/))this.value=0+this.value;if(this.value.match(/^\.$/))this.value=0;this.o_value=this.value}"/>12、只能输入字母和汉字：
<a-input onkeyup="value=value.replace(/[\d]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[\d]/g,''))" maxlength=10 name="Numbers"/>13、只能输入英文字母和数字，不能输入中文：/[^\w./]/ig
14、只能输入数字和英文：/[^\d|chun]/g
15、小数点后只能有最多两位(数字、中文都可输入)，不能输入字母和运算符号：
<a-input onKeyPress="if((event.keyCode<48 || event.keyCode>57) && event.keyCode!=46 || /\.\d\d$/.test(value))event.returnValue=false">
16、小数点后只能有最多两位(数字、字母、中文都可输入)：
<a-input onkeyup="this.value=this.value.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3')">
17、不可输入中文：/[\u4E00-\u9FA5]/g
18、不可输入空格：/\s+/g
到此这篇关于Vue正则表达式限制input的输入的文章就介绍到这了,更多相关正则表达式限制input的输入内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
Vue3中实现代码高亮的两种方法(prismjs和highlight.js)
最近忙着开发自己的博客系统,在做界面展示的时候,需要让代码高亮,于是经过在网上查阅,发现有两款比较好用的插件实现代码高亮,分别是prismjs和highlight.js,下面我分别介绍下,方便给需要的同学参考2025-04-04
这篇文章主要介绍了Vue前端柱状图实例(叠状条形图)，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-03-03
这篇文章主要介绍了在vue中使用inheritAttrs实现组件的扩展性介绍，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-12-12
路由跳转的同时传递参数是比较常见的,下面这篇文章主要给大家介绍了关于vue3路由配置以及路由跳转传参的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2023-04-04
这篇文章主要介绍了vue脚手架及vue-router基本使用，非常不错，具有参考借鉴价值,需要的朋友可以参考下2018-04-04
vue el-table中使用el-select选中后无效的解决
这篇文章主要介绍了vue el-table中使用el-select选中后无效的解决方案，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-08-08
这篇文章主要介绍了vue render函数动态加载img的src路径操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-10-10
Vue3中的 computed,watch,watchEffect的使用方法
这篇文章主要介绍了Vue3中的 computed,watch,watchEffect的使用方法，文章围绕主题展开详细的内容介绍，具有一定的参考价价值，需要得小伙伴可以参考一下2022-06-06
Vue3 使用Element Plus表格单选带checkbox功能
这篇文章主要介绍了Vue3 使用Element Plus表格单选带checkbox,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友参考下吧2023-11-11
这篇文章主要介绍了在Vant的基础上实现添加验证框架的方法示例，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-12-12
最新评论