在上一个博客中,有关于限制长度的使用,本文介绍限制只能输入数字的方法

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 只能输入数字并限制长度的更多相关文章

  1. input只能输入数字并限制长度

    <style> /*在chrome下移除input[number]的上下箭头*/ input::-webkit-outer-spin-button,input::-webkit-inner ...

  2. 限制HTML的input只能输入数字、英文、汉字...

    限制HTML的input只能输入数字.英文.汉字... 关键词:正则表达式, JavaScript, HTML, input 常用HTML正则表达式1.只能输入数字和英文的:<input onk ...

  3. INPUT只能输入数字

    input只能输入数字: (只能输入数字,并且输入的值不能大于99),但是这样有个问题,就是当输入非数字字符时,输入框中所有的字符都会被清除 <input type="text&quo ...

  4. javascript正则表达式控制input只能输入数字

    不能输入中文 <input type="text" name="textfield"  onkeyup="this.value=this.val ...

  5. 用js使得输入框input只能输入数字

        JS判断只能是数字和小数点1.文本框只能输入数字代码(小数点也不能输入)<input onkeyup="this.value=this.value.replace(/\D/g, ...

  6. 关于input只能输入数字的两种小方法

    第一种: 直接给input标签 name赋值如下 <input name="start_price" id="start_price" type=&quo ...

  7. 控制input只能输入数字和两位小数

    <input type="text" name="je" onkeyup="clearNoNum(this)" /> funct ...

  8. input 只能输入数字、字母、汉字等

    1.文本框只能输入数字代码(小数点也不能输入) <input onkeyup="this.value=this.value.replace(/\D/g,'')" onafte ...

  9. jquery控制input只能输入数字和两位小数

    jquery代码 function num(obj){ obj.value = obj.value.replace(/[^\d.]/g,""); //清除"数字" ...

随机推荐

  1. PMP备考笔记--1.1

    题型 200道中英文单选题 基本概念题(%10) 过程工具/技术和输入输出题ITTO (%10) 情景题(%70) 计算题(3-5道题) 图 pmp四大挑战 试卷100页,题干长,阅读量大,考试4个小 ...

  2. Linux DNS 服务器配置与管理

    一.环境介绍: 运行软件:VMware Workstation Pro 14 系统环境:CentOS-7-x86_64-1810 二.操作配置: 1.基础知识简介 (1)域名空间 域和域名: DNS树 ...

  3. poj3348(求凸包面积)

    题目链接:https://vjudge.net/problem/POJ-3348 题意:转换题意后即是求凸包的面积. 思路: 套模板,求凸包面积即转换为多个三角形面积之和,用叉积求,然后除2,因为本题 ...

  4. vue-scroller 滑动组件使用指南

    在页面中经常会用到滚动,下拉刷新,下拉加载等功能,vux的scroller可以使用,但是它不再维护,而且要配合load-more组件一起使用.所以一般在项目中我都是用vue-scroller. vue ...

  5. Java:session中的invalidate()的作用是什么呢?求解

    手工杀会话.会话失效有2种可能:超时和手工杀会话.手工杀方便省时间,程序员都爱用. 比如我做一个程序需要登录,中间访问的页面有会话控制,如果没有登录则跳转到登录页面,退出时清会话信息. 这是有两个选择 ...

  6. 构建工具-Gulp 相关知识

    layout: layout title: 『构建工具-Gulp』相关内容整理 date: 2017-04-26 22:15:46 tags: Gulp categories: Tools --- G ...

  7. Java中XML的四种解析方式(一)

    XML是一种通用的数据交换格式,它的平台无关性.语言无关性.系统无关性给数据集成与交互带来了极大的方便.XML在不同的语言环境中解析的方式都是一样的,只不过实现的语法不同而已. XML文档以层级标签的 ...

  8. WUSTOJ 1318: 区间的连通性(Java)

    题目链接:

  9. RT1502移植LUA成功的总结

    1.由于LUA需要至少50K的RAM(经验值),所以stack和heap设置的尽量大,当前分别都设置为了64K.在文件rt1052_flexspi_scf.scf里面改动: #define Stack ...

  10. go http简单的表单处理

    //表单处理 package main import (     "net/http"     "io"     "fmt"     &qu ...