实现elementui输入框只允许输入数字(不是type=‘number‘)

最新推荐文章于 2025-01-16 14:48:19 发布

原创最新推荐文章于 2025-01-16 14:48:19 发布 · 403 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #html5 #javascript #es6

elementui 专栏收录该内容

15 篇文章

订阅专栏

这篇博客介绍了一种使用正则表达式的方法，实现在输入框中仅允许用户输入数字的功能。通过在`<el-input>`组件的`oninput`事件中设置`value=value.replace(/[^d]/g,'')`，可以实时过滤掉非数字字符，确保输入内容的合法性。

 <el-input  oninput="value=value.replace(/[^\d]/g,'')" v-model="formData.cellPhoneNumber" placeholder="请输入"></el-input>

//加入
oninput="value=value.replace(/[^\d]/g,'')"
//即可

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

于丸

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

【Vue2 + ElementUI】NumberInput数字输入框组件

Komorebi_00的博客

08-01

1437

限制数字输入框输入格式

【elementui】el-input只允许输入数字和输入小数时以.开头的数字自动补0

bbt953的博客

12-20

260

el-input只允许输入数字和输入小数时以.开头的数字自动补0

参与评论您还未登录，请先登录后发表或查看评论

关于element-ui表单中限制输入纯数字的解决方式

10-14

主要介绍了关于element-ui表单中限制输入纯数字的解决方式，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧

基于elementui input完成的输入控件

longgege001的博客

11-12

3870

input输入框组件

element-ui：el-input输入数字-整数和小数

彭世瑜的博客

06-02

6591

需求是：发现网上大部分文章的处理方式：比对一下几种方案后，最终使用的是实现几种方式对比

element ui 输入框只能输入数字

小男孩的博客

07-29

232

element ui 输入框只能输入数字

vue中elementUI中输入框只能输入数字

路人甲的博客

08-25

2606

关于vue中elementUI中输入框只能输入数字，除了数字其他什么都不可输入，包括标点符号，英文在内

elementUI el-input type=number时改变输入框内容，规定的类型为数字，缺返回了字符串

最新发布

09-24

例如：<el-input v-model.number="inputValue" type="number"> 注意：如果输入的值无法被解析为数字（例如空字符串或非数字字符），则返回原始字符串。因此，在数据处理时需要注意。 2. 在事件处理函数中手动...

vue项目移动端实现ip输入框问题

12-11

type=number类型，不会禁止点的输入。手动过滤拿不到包括点字符的字符串.而且输入多个点之后，拿到的值为空. 解决办法：type=tel,只能输入数字，且可以获取到点字符的输入问题：微信下keyup事件无效，回调事件中...

elementui输入框限制只能输入正整数

02-23

为了确保用户只能在输入框中输入正整数，在 Element UI 中可以采用两种主要方法来实现这一目标： #### 方法一：通过自定义校验规则可以在表单项 (`<el-form-item>`) 的 `rules` 属性内设置特定的验证器函数，该...

element el-input只能输入数字

在职可交流前端开发，包括：web端、uniapp等，欢迎指教。

01-16

1230

在项目中做新增功能的时候，前端需要限制用户的输入，这里例如：在input 输入框只能输入数字。第2点，如果我想限制的是，输入的是数字+限制数字位数。实现思路：input输入框只能输入数字；限制数字位数。数字的是Int整型，要想限制长度，可以先把数字转成字符串，然后用.length判断字符串长度。

elementui el-input 限制只能输入数字

m0_37210775的博客

12-29

870

加上：@keyup.native=“form.time1 = confirmInteger(form.time1)”

vue2 elementUi 输入框限制只能输入数字、小数点，且控制小数点位数

m0_63464623的博客

03-21

794

【代码】vue2 elementUi 输入框限制只能输入数字、小数点，且控制小数点位数。

关于element-ui的输入框限制只能输入数字的问题

热门推荐

weixin_45021068的博客

01-14

2万+

关于element-ui的输入框限制只能输入数字的问题这个问题我使用过很多办法,每一种都去尝试，但是结果都不太理想比如以下的几种方法注：我要的效果是，输入框内只可输入数字，除了数字其他什么都不可输入，包括标点符号，英文在内第一种、使用el-input自带原生的 type=“number” 他存在着两个问题首先，type="number"允许输入e 其次，maxlength属性也不生效第二种、使用oninput <el-input v-model='width' onin

element-ui el-autocomplete怎么使用以及怎么控制只能输入数字

肖肖肖丽珠的博客

08-07

5939

el-autocomplete实现的效果是输入内容下面给提示.然后选择一条就填写到了相应的位置 <el-autocompleteclass="w300"popper-class="searchUser" v-model="addSForm.mobile" :fetch-suggestions="querySearch" v-numberonlys placeholder="请输入内容" @select="usernameSelect" clearable...

elementUI表单使用oninput限制输入数字导致校验有时不通过问题

cyongxing的博客

05-26

1167

使用elementUI表单时，领导说数字输入框不能要那两个上下的箭头，所以不能用type="number"限制输入，所以我改成用oninput限制输入数字。这个问题是因为用了oninput限制输入数字导致的，所以我就想换另外一种方法限制，然后找到一个可以在表单验证rules 那里限制输入数字的方法，本来这样写也没毛病，但是使用的时候就经常发现一个问题，明明输入框已经输入数据，可是表单校验还是校验不通过。找了很久才发现，先输入一个不是数字的数，然后再输入数字，就有可能会出现校验不通过的情况。

封装方法：只能输入数字

好好做前端

07-13

565

前些日子，在看是用JavaScript片段时，有写到限制输入（只能输入数字），今天要用，就做了简单的封装，方便调用。<input type="text" id="certno" name="certno"> var onlyNumber = { onm : function(param) { if (!param) return;

elementui el-input输入框正则限制

DarlingYL的博客

02-28

4345

1、只能输入数字且小数点为3位、只有一位小数点、0开头后面不是小数点则以数字替换、自动补全。2、只能输入英文且只能输入2位数。

输入框input（element-ui、antd)中el-input组件只能输入数字(空格无效)

agua001的博客

08-10

6680

input标签或者el-input标签 <input type="text" placeholder="请输入手机号" class="search_txt" v-model="searchPhone" maxlength="11" oninput = "value=value.replace(/[^\d]/g,'')"> <el-input v-model="searchForm.phone" placeholder="请输入手机号" maxlength="11" oninput = "