el-input 只能输入数字并限制长度
在上一个博客中,有关于限制长度的使用,本文介绍限制只能输入数字的方法
el-input 代码如下:
<el-form-item label="账号" required>
<el-input v-model="form.tele" style="width:160px;" oninput="if(value.length>11)value=value.slice(0,11)" placeholder="请输入账号" type="number"></el-input>
</el-form-item>
在main.js中加入如下代码:
Vue.directive('enterNumber', {
inserted: function (el) {
el.addEventListener("keypress",function(e){
e = e || window.event;
let charcode = typeof e.charCode === 'number' ? e.charCode : e.keyCode;
let re = /\d/;
if(!re.test(String.fromCharCode(charcode)) && charcode > 9 && !e.ctrlKey){
if(e.preventDefault){
e.preventDefault();
}else{
e.returnValue = false;
}
}
});
}
});
演示如下:

el-input 只能输入数字并限制长度的更多相关文章
- input只能输入数字并限制长度
<style> /*在chrome下移除input[number]的上下箭头*/ input::-webkit-outer-spin-button,input::-webkit-inner ...
- 限制HTML的input只能输入数字、英文、汉字...
限制HTML的input只能输入数字.英文.汉字... 关键词:正则表达式, JavaScript, HTML, input 常用HTML正则表达式1.只能输入数字和英文的:<input onk ...
- INPUT只能输入数字
input只能输入数字: (只能输入数字,并且输入的值不能大于99),但是这样有个问题,就是当输入非数字字符时,输入框中所有的字符都会被清除 <input type="text&quo ...
- javascript正则表达式控制input只能输入数字
不能输入中文 <input type="text" name="textfield" onkeyup="this.value=this.val ...
- 用js使得输入框input只能输入数字
JS判断只能是数字和小数点1.文本框只能输入数字代码(小数点也不能输入)<input onkeyup="this.value=this.value.replace(/\D/g, ...
- 关于input只能输入数字的两种小方法
第一种: 直接给input标签 name赋值如下 <input name="start_price" id="start_price" type=&quo ...
- 控制input只能输入数字和两位小数
<input type="text" name="je" onkeyup="clearNoNum(this)" /> funct ...
- input 只能输入数字、字母、汉字等
1.文本框只能输入数字代码(小数点也不能输入) <input onkeyup="this.value=this.value.replace(/\D/g,'')" onafte ...
- jquery控制input只能输入数字和两位小数
jquery代码 function num(obj){ obj.value = obj.value.replace(/[^\d.]/g,""); //清除"数字" ...
随机推荐
- IDEA中的,让光标回到上一次停留的地方
IDEA中的,光标返回到上一次停留的地方ctrl+alt+ ←IDEA中的,光标返回到下一次停留的地方ctrl+alt+ → 不过要小心,笔记本电脑,默认的翻转屏幕的快捷键和这个冲突..我的选择是关闭 ...
- 《构建之法》——GitHub和Visual Studio的基础使用
git地址 https://github.com/microwangwei git用户名 microwangwei 学号后五位 62214 博客地址 https://www.cnblogs.com/w ...
- 设计模式之--Visitor
Ref: https://www.jianshu.com/p/feec47a25b67 https://www.cnblogs.com/alphablox/p/5346567.html
- jenkins publish .net core application to linux server
最近学习Docker与Jenkins, 网上大部分都是关于Jenkins+Git+Docker进行持续远程部署, 我一直在考虑为什么Jenkins和Docker要绑定一块使用, 因为我想单独使用Jen ...
- ABP中的本地化处理(下)
在上篇文章中我们的重点是讲述怎样通过在Domain层通过PreInitialize()配置ILocalizationConfiguration中的Sources(IList<ILocalizat ...
- Python中创建数值列表——参考Python编程从入门到实践
1. 函数range( )的使用 range( )函数可以生成一系列的数字: for value in range(1, 5): print(value) Note:运行结果是打印数字1到4,即该函数 ...
- 【HC89S003F4开发板】 4端口消抖
HC89S003F4开发板端口消抖 一.前言 看到资料里有中断消抖的例子,因为以前项目里有遇到高频干扰频繁退出休眠的情况,所以好奇用这个配置能不能解决. 二.对demo进行修改 @实现效果 P01设置 ...
- jdk8新特性--函数式接口的使用
函数式接口的概念: 函数式接口的格式: 示例: 函数式接口的使用: 简化lambda表达式:
- [Luogu5280][ZJOI2019]线段树(线段树+DP)
https://www.luogu.org/blog/Sooke/solution-p5280 首先想到对线段树上每个点分别维护有多少棵线段树在它上有标记(f[]),然后想到对于每个操作,根据转移的不 ...
- SQL Server2008本地数据库调用SP发送邮件
一.首先要对本地数据库做配置 1.通过使用数据库邮件配置向导和sp_configure存储过程配置启用数据库邮件: 注:服务器名称填写发送服务器的路径或者IP,电子邮件地址为寄件者地址 配置好数据库邮 ...