vue input输入框长度限制失效

最新推荐文章于 2023-08-30 14:12:42 发布
最新推荐文章于 2023-08-30 14:12:42 发布
阅读量1.3k 收藏 1
点赞数 2
分类专栏： VUE 文章标签： vue.js 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_37380802/article/details/110949880
版权

vue input输入框长度限制

今天在开发登录页时，需要设置登录输入框的长度，输入类型为number

1

<input type="number" maxlength="11" placeholder="请输入手机号">

  发现在这样写时，输入长度限制并没有生效，经过测试发现在type为number或者text时，设置maxlength参数并不会生效。

1

<input type="number" oninput="if(value.length > 11)value = value.slice(0, 11)" placeholder="请输入手机号">

瘦瘦瘦大人
关注
  • 2
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
Vue input 最大输入长度不生效
贪睡的小聪
02-26 4704
Vue IOS input 最大输入长度不生效 &lt;div class="input_view"&gt; &lt;input type="number" v-model="mobile" maxlength="11" class="input" &gt; &lt;/div
iview中input限制输入字符长度
wenchang-的博客
05-06 1461
在实际需求中，往往需要限制input输入字符串长度，在iview中和h5中的input有很大区别 1.在h5中input限制字符输入长度 <input type="text" name="fullname" maxlength="15" /> 2.在iview中限制字符输入长度 <Input placeholder="请输入..." :maxlength="14" v-model="message" ></Input> 总结：在这里容易受到主关影响，在.
iOS 键盘限制输入内容限制、输入长度限制
扬帆追梦人
06-23 2453
经常会遇到 键盘 输入的字符长度的限制，比如常见的 手机号只能输入11位数等。比如我们项目中总共92个输入框需要限制位数及输入键盘的样式。方法如下： UITextFieldTextDidChangeNotification 是系统的通知,监听该通知来做相应处理 // 在你的界面注册通知， [[NSNotificationCenter defaultCenter] addO
当element ui 的input 中max-length 不生效的问题
weixin_42708755的博客
08-18 789
input 中maxlength不生效的问题
移动端限制input框只能输入数字，在iOS不生效的解决办法
岁末zzz的博客
02-18 1008
pattern=’[0-9]*’
vue 表单输入框不支持focus及blur事件的解决方案
01-21
let mtinput = el.querySelector('input') mtinput.onfocus = function () { ...//如果要对节点的数据进行更改,且更改要映射到页面上,则更改可在vnode.context上进行,这样,改完之后,改变就会映射到页面 } ...
使用Vue-scroller页面input框不能触发滑动的问题及解决方法
10-14
在开发Vue应用时，我们可能会遇到使用第三方滚动库如Vue-scroller时，遇到的一个常见问题：在页面中包含`<input>`输入框时，用户在输入框区域内无法触发滚动操作。这个问题主要是由于Vue-scroller组件内部的源码逻辑...
快速解决element的autofocus失效问题
10-14
原因在于 `el-input` 组件是由多个内部元素组成的，外部直接设置的 `autofocus` 属性可能无法穿透到真正的输入框元素。 解决这个问题的方法之一是通过 Vue 的 `ref` 特性。`ref` 可以让我们在 Vue 实例中引用组件或...
解决unity打包webgl输入框不能输入中文Tool
06-02
1.解决unity打包webgl输入框不能输入中文的插件 2.简单好用, 3.找到里面的WebGlInput脚本,直接挂到InputField输入框上 4.里面有另外的中文字体包,需要把输入框上的字体替换一下 5.打包测试即可 6.亲测2021.3.4unity...
将input file的选择的文件清空的两种解决方案
09-04
首先，通过`getElementById`获取到`<input type="file">`元素的引用，然后调用`select()`方法选中该输入框，接着使用`document.selection.clear()`清除当前的选择。这种方法基于浏览器的旧版选择和清除机制，其工作...
iOS UITextField, UITextView输入长度限制，系统自带中文输入法的Bug
豪冷的博客
12-30 831
起因 项目中，由于要对用户输入的文字，进行 长度限制 于是，便使用了 JHInputLimit 由于不习惯 系统自带 的输入法 所以几乎没用 系统自带 的输入法进行过测试 这就导致了潜在的 Bug 没有被发现
iview inputNumber 输入框有值但是校验失败
weixin_39818813的博客
12-09 2652
表单校验的时候，输入输入的数字，但是表格依然校验失败。原因：校验的时候，是先执行校验的回调函数，再执行修改赋值。 可以通过打印验证是否是这种情况： 很明显，获取修改后值的方法111111打印在后，校验逻辑2222打印在前。 <template> <Form ref="form" inline :model="form" :label-width="120" :rules="rules"> <FormItem label="汇款金额" prop="money
el-input-number 默认值设置失效
hu961691590的专栏
08-24 3448
今天需要设置一个计数器在默认情况下是没有值的，有最大值和最小值。在百度上找的答案基本是通过绑定v-model的值为undefined，不知道为什么我这里没有效果，在尝试最简单的计数器下通过v-model绑定也没有成功。在前端的帮助下，通过在el-input-number中设置:min=null实现了默认值是没有值的，因为百度搜的答案都没有解决这种情况的问题，特此记录下来，希望能帮到更多人。 下面是代码和效果图： ...
使用正则限制输入框输入内容
weixin_41395548的博客
11-12 3462
使用正则来让输入框只能输入数字字母，不能输入汉字，并且四位一空格 我使用的是vant的field组件，但是和input是一样的 <van-field placeholder="请输入密码" v-model="inputValue" @change="onChange" @input="onInput" @paste="onPaste" /> 正则方法 format( data ) { return data.replace( /[^\w\s/]/ig, '' ).replace(
Vant—van-field textarea 二次封装 高度自适应并设置最大最小高度
Poppy_LYT的博客
08-30 1万+
1、components新建CommentField.vue <template> <div class="comment-field-wrap"> <div class="comment-field__input"> <van-field :value="value" placeholder="请输入留言内容" rows="1" // 显示为一行的高度 type="texta.
vue3 elementPlus input输入小写自动转为大写 vant限制输入
weixin_46463643的博客
08-29 1857
vue3 elementPlus input输入小写自动转为大写
vue2项目中el-input单独使用max和maxlength不生效问题
最新发布
six6de6的博客
08-30 2694
今天在vue2的项目中使用element中的组件，因为没有使用form所以max和maxlength属性没有生效，下面是解决办法。使用oninput方法可以控制value值的显示然后来解决值的显示问题。
input number 数字输入限制，最大值最小值输入范围限制
热门推荐
qq_43535970的博客
10-25 1万+
input number 数字输入限制，最大值最小值输入范围限制
如何对vant输入框同时进行2个校验
weixin_45121510的博客
12-23 2939
<van-field v-model.trim="submitParams.title" autocomplete="off" :rules="[{ required: true},{validator, message: '输入长度50字符以内'}]" /> <van-field v-model.trim="submitParams.offset" type="digit" name="offset" :rules="[{ required: true},{valvalida
vue input输入框失去焦点
08-29
在Vue中，可以使用"@blur"来监听input输入框失去焦点的事件。具体写法如下： <input type="text" placeholder="请输入" @blur="xxx()"> 在这个例子中，"xxx()"是你定义的方法，在输入框失去焦点时会触发该方法。你...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

瘦瘦瘦大人

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值