vue input 输入校验字母数字组合且长度小于30的实现代码


Posted in Javascript onMay 16, 2018

下面一段代码给大家分享vue input 校验字母数字组合且长度小于30,具体代码如下所示:

<Input v-model="form.glhm" placeholder="请输入关联交易号" style="width:240px" @on-blur="validateJyh(form.glhm)"></Input> 

validateJyh(glhm){//校验关联交易号 
    var reg = /^[A-Za-z0-9]{1,30}$/; 
    if(!reg.test(glhm)){ 
     this.$Message.error("请输入字母或数字组成的交易关联号"); 
     this.form.glhm = ''; 
    } 
   },

下面看下在Vue.Js下使用el-input框只能输入数字并限制位数并且限制中文输入以及粘贴

var tr = document.getElementById("Id1"), // 取得ID为Id1的tr对象
 inps = tr.getElementsByTagName('input'); // 从tr 对象中获取所有input对象
for(var i = 0, len = inps.length; i < len; i++) {
 inps[i].value = ''; // 将每一个input的value置为空
}
document.getElementById("t").getElementsByTagName('input')[0].value='';

输入中文置空的方法

<el-input
@change="checkNo(searchForm.msel.mselTotalConsumTimes)"
type = "text"
onkeypress="return event.keyCode>=48&&event.keyCode<=57"
size="small"
:maxlength="6"
style="width: 120px"
v-model="searchForm.msel.mselTotalConsumTimes"></el-input>
 次
</el-col>

checkNo(value){
let reg = /^[1-9]\d*$/;
if (value) {
if (value >
999999 || new
RegExp(reg).test(value) ==
false) {
setTimeout(() 
=> {
this.searchForm.msel.mselTotalConsumTimes ='';
   }, 500);
}
}
},

总结

以上所述是小编给大家介绍的vue input 校验字母数字组合且长度小于30的实现代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
你所要知道JS(DHTML)中的一些技巧
Jan 09 Javascript
Javascript 圆角div的实现代码
Oct 15 Javascript
JavaScript开发人员的10个关键习惯小结
Dec 05 Javascript
jQuery Validate初步体验(一)
Dec 12 Javascript
JavaScript prototype属性详解
Oct 25 Javascript
详解PHP中pathinfo()函数导致的安全问题
Jan 05 Javascript
js实现淡入淡出轮播切换功能
Jan 13 Javascript
JavaScript动态绑定详解
Sep 14 Javascript
使用vue点击li,获取当前点击li父辈元素的属性值方法
Sep 12 Javascript
微信小程序外卖选购页实现切换分类与数量加减功能案例
Jan 15 Javascript
详解JavaScript 作用域
Jul 14 Javascript
如何使用原生Js实现随机点名详解
Jan 06 Javascript
详解通过源码解析Node.js中cluster模块的主要功能实现
May 16 #Javascript
浅谈如何通过node.js对数据进行MD5加密
May 16 #Javascript
如何用input标签和jquery实现多图片的上传和回显功能
May 16 #jQuery
vue keep-alive请求数据的方法示例
May 16 #Javascript
解决vue项目中type=”file“ change事件只执行一次的问题
May 16 #Javascript
vue-cli与webpack处理静态资源的方法及webpack打包的坑
May 15 #Javascript
JavaScript常用截取字符串的三种方式用法区别实例解析
May 15 #Javascript
You might like
饭制《星际争霸》Mod:优化游戏机制 增加新单位
2017/07/02 星际争霸
虫族 Zerg 魔法科技
2020/03/14 星际争霸
php自动适应范围的分页代码
2008/08/05 PHP
PHP面向对象程序设计内置标准类,普通数据类型转为对象类型示例
2019/06/12 PHP
Laravel中如何轻松容易的输出完整的SQL语句
2020/07/26 PHP
LBS blog sql注射漏洞[All version]-官方已有补丁
2007/08/26 Javascript
jquery在IE、FF浏览器的差别详细探讨
2013/04/28 Javascript
jQuery对指定元素中指定字符串进行替换的方法
2015/03/17 Javascript
JavaScript中字符串分割函数split用法实例
2015/04/07 Javascript
浏览器中url存储的JavaScript实现
2015/07/07 Javascript
js 提交form表单和设置form表单请求路径的实现方法
2016/10/25 Javascript
JS Select下拉框(支持输入模糊查询)
2017/02/04 Javascript
浅谈Angular路由守卫
2017/08/26 Javascript
swiper插件自定义切换箭头按钮
2017/12/28 Javascript
引入外部js脚本加载慢与页面白屏问题的解决
2018/12/10 Javascript
浅谈Javascript常用正则表达式应用
2019/03/08 Javascript
通过layer实现可输入的模态框的例子
2019/09/27 Javascript
[03:45]Newbee战队出征西雅图 决战2016国际邀请赛
2016/08/02 DOTA
Python中使用PDB库调试程序
2015/04/05 Python
Python在Windows和在Linux下调用动态链接库的教程
2015/08/18 Python
python实现list由于numpy array的转换
2018/04/04 Python
Python中py文件转换成exe可执行文件的方法
2019/06/14 Python
python字符串格式化方式解析
2019/10/19 Python
tensorflow之变量初始化(tf.Variable)使用详解
2020/02/06 Python
Python +Selenium解决图片验证码登录或注册问题(推荐)
2020/02/09 Python
Python内存映射文件读写方式
2020/04/24 Python
浅谈python 调用open()打开文件时路径出错的原因
2020/06/05 Python
光声世纪笔试题目
2012/08/25 面试题
团员学习总结的自我评价范文
2013/10/14 职场文书
法务专员岗位职责
2014/01/02 职场文书
学习三严三实对照检查材料思想汇报
2014/09/22 职场文书
学生抄袭作业的检讨书
2014/10/02 职场文书
证券公司客户经理岗位职责
2015/04/09 职场文书
撤诉状格式范本
2015/05/19 职场文书
Python中re模块的元字符使用小结
2022/04/07 Python
MySQL transaction事务安全示例讲解
2022/06/21 MySQL