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,""); //清除"数字" ...
随机推荐
- const的用法及它在C语言和C++中的不同
(1)可以定义const常量. (2)Const可以修饰函数的参数和返回值,甚至定义体.被const修饰的东西都受到强制保护. (3)Const修饰成员函数时,用于成员函数前面,则返回值不能作为左值. ...
- qbittorrent搜索在线插件
https://raw.githubusercontent.com/khensolomon/leyts/master/yts.py https://raw.githubusercontent.com/ ...
- Python 环境搭建(Win 安装以及Mac OS 安装)
千里之行始于足下,今天我们先来学习 Python 环境搭建. 注意:本系列教程基于 Python 3.X Python 环境搭建 Win 安装 打开 Python 官网 https://www.pyt ...
- 036 Android Xutils3网络请求框架使用
1.xUtils3 介绍 xUtils 中目前包括了主要的四大模块,分别为 DbUtils 模块.ViewUtils 模块.HttpUtils 模块以及 BitmapUtils 模块. xUtils3 ...
- NGINX---一次阿里云宝塔开发flask经历
1.放行端口问题 不但需要在阿里云官网服务器控制台放行端口,还需要在宝塔里面放行端口 2.nginx 宝塔默认的用户是www 句法: user user [group]; 默认: 用户无人; 语境: ...
- PAT(B) 1068 万绿丛中一点红(C)
题目链接:1068 万绿丛中一点红 (20 point(s)) 参考博客:1068. 万绿丛中一点红(20) i逆天耗子丶 题目描述 对于计算机而言,颜色不过是像素点对应的一个 24 位的数值.现给定 ...
- WUSTOJ 1336: Lucky Boy(Java)博弈
题目链接:1336: Lucky Boy 参考博客:LUCKY BOY 博弈--HandsomeHow Description Recently, Lur have a good luck. He i ...
- Mongodb命令行导入导出数据
第一步,找到mongodb安装目录第二步,从命令行进入mongodb安装目录下的bin目录第三步(1),导出数据命令(导出的文件有两种格式:json/csv,此处导出的是json文件,对于导出CSV文 ...
- vue防止闪屏小技巧:[v-cloak]
css 内添加此属性[v-cloak] { display: none; } html中引入即可 <div v-cloak> {{ message }} </div> 如果觉得 ...
- O(1) gcd 板子
const int N = 2e5+10; const int M = 500; int cnt, p[N], _gcd[M][M]; int v[N][3],vis[N]; int gcd(int ...