vue项目禁止input输入小数点

最新推荐文章于 2024-06-13 10:45:00 发布
最新推荐文章于 2024-06-13 10:45:00 发布
阅读量3.8k 收藏 3
点赞数 1
分类专栏： vue 文章标签： 禁止小数点
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_37942845/article/details/95318785
版权 
<van-field
  v-model="inputPirce"
  input-align='right'
  type='tel'
  maxlength='10'
  :disabled="type===1"
  @input="pirceInput"
 />

pirceInput () {
      let str = '' + this.inputPirce
      if (str.indexOf('.') !== -1) {
        let arr = str.split('')
        arr.splice(arr.length - 1)
        let str2 = arr.join('')
        this.inputPirce = +str2
      }
    }

在输入的事件相应里进行一下拦截处理就行了

胜天一子半
关注
专栏目录
vue快速限制input框可输入的数字类型（整数，正整数，小数限制小数点后几位）
rookie_lee1210的博客
04-21 6044
vue快速限制input框可输入的数字类型（自然数，正整数，小数限制小数点后几位） 项目中有许多地方需要限制输入框中的数字，比如只允许输入正整数啦，只允许输入自然数（正整数包括0），小限制小数点位数的需求，这些我们大可以封装一个公共的mixins混合方法放在公共部分，然后给input输入框绑定一个@input事件来调用mixins方法就可以啦。 先上代码，开锤开锤，直接莽 方法封装 先在src...
vue 限制input只能输入正数的操作
11-19
在某些项目中 input 框只能输入数字，可以用以下办法： 先在标签上绑定上 @input 事件来监听标签的值变化，通过正则来改变输入的值。 <input class="keep_input" v-number-only style="width:35px" v-model="scope.row.fileOrder" @input="scope.row.fileOrder = Number($event.target.value.replace(/\D+/, ''))" /> 第二部封装个自定义指令放在标签上！ directives: { numberOnly
vue限制输入框禁止输入小数点
weixin_45966674的博客
10-13 2504
我们这里onkeyup用的this 是输入框本身 value 是真的输入框的value 所以 你不用担心输入框v-model 上绑定了什么。type="number"能阻止用户输入字符等但还是防止不了小数点 因为小数点在数字类型的输入中是合理的。这样就能很好的规避 用户输入小数点 而且就一行代码 直接有效。我们可以在onkeyup中做一些手脚。有一些需求会要求我们只能输入正整数。
Vue 限制input输入数字 不可小数
Yujis的博客
04-16 1859
1.Vue 限制input输入数字 不可小数 <el-input class="input-sort" onkeyup="this.value = this.value.replace(/[^\d]/g,'');" placeholder="请输入" v-model.trim="scope.row.amount" clearable></el-input>
【VUE禁止输入框输入小数点】
qq_44712196的博客
09-22 844
VUE禁止输入框输入小数点两种方案，亲测有效
VUE中实现输入框禁止输入小数
yangli_的博客
11-09 1482
VUE中实现输入框禁止输入小数
vue:el-input输入时限制输入的类型操作
10-15
在使用Vue框架结合Element UI组件库开发应用时，el-input组件是一个常用的表单输入框，它可以用来获取用户的输入数据。然而，在实际应用中，我们往往需要对用户的输入进行限制，比如限制输入类型、输入格式、输入...
vue指令只能输入正数并且只能输入一个小数点的方法
08-27
在使用Vue进行前端开发时，经常会遇到需要对用户输入进行限制的情况，尤其是涉及到数字和小数点的场景。本文介绍了一种使用Vue指令来限制只能输入正数，并且确保只有一个小数点的方法。 首先，我们需要创建一个Vue...
input 输入框禁止输入小数点
热门推荐
12-18 1万+
最近做一个项目需求是输入框只能输入数字，并且禁止输入小数 intpu type=number 就可以控制只允许输入数字，但是不能控制输入小数 在网上查阅相关资料后整理了下 代码如下 input type=number 禁止输入小数点 $(document).ready(function(){ var ipt = $('#num
input输入框禁止输入小数点方法
最新发布
qq_43235503的博客
06-13 1029
input输入框禁止输入小数点方法
Vue ElementUI实现:限制输入框只能输入正整数的问题
11-19
input输入框中禁止输入小数和负数（*只允许输入正整数 *） 最近在做项目中碰见了这么个问题，需要输入数字，但是只能输入正整数，在网上找的没找到自己想要的，所以就自己想了两个办法，在这里跟大家分享一下。（因为是刚毕业，第一次写博客，所以有点生疏，请各位大佬担待一些） 方法一：利用禁止按键的方法，主要是依靠禁止按下减号以及小数点来完成的 首先要监听keyup（键盘按下）事件，因为elementUi上面的input组件监听事件是没有这个事件的，所以可能会报错，所以我们需要加个vue事件的修饰符 .native，代表原生事件的意思。 然后我们传个$event对象进去来获取原生的DOM（可以简单理
1.文本框只能输入数字代码(小数点也不能输入)
qsyhcd的专栏
02-28 4814
1.文本框只能输入数字代码(小数点也不能输入)2.只能输入数字,能输小数点.输入数字);this.value=;}">3.数字和小数点方法二4.只能输入字母和汉字5.只能输入英文字母和数字,不能输入中文6.只能输入数字和英文chun7.小数点后只能有最多两位(数字,中文都可输入),不能输入字母和运算符号:57) && event.keyCode!=46 || //./
vue中文本框限制输入小数点和数字
weixin_44953664的博客
12-30 3209
<el-input v-model="item.money" @keyup.native="UpNumber" @keydown.native="UpNumber" /> //代码 UpNumber(e) { // 输入框中只允许输入数字 e.target.value = e.target.value.replace(/[^\d]/g, '') ...
input框输入限制
weixin_40362806的博客
11-23 498
【代码】input框输入限制。
Vue 限制input只输入数字 不可小数 或 只允许输入数字字母
灰海
06-05 1879
Vue 限制input输入数字 不可小数
如何设置只能输入正整数,且不能输入01,001格式（pc端/h5端不同实现方式）
weixin_45121510的博客
12-04 3884
<!-- 允许输入正整数，调起纯数字键盘 --> <van-field v-model="digit" type="digit" label="整数" /> 有时设置了digit，但还是可以输入负数，可能是版本问题：vant文档申明： Tips: digit 类型从 2.4.2 版本开始支持 这时我们可以和正则搭配使用： // 限制只能输入正整数 'digit':function(v) { // 回填值是number类型的情况，做个判断 if(typeof v == 'nu
vue,js 限制输入负数，限制小数位的输入框，限制输入长度，兼容移动端，兼容中英文输入法，最完美的解决方案。
PrimaryColor
09-14 4899
输入框限制输入负数的方法，不能将输入框设置为type="number"类型的输入框，只能是type="text"的输入框，我尝试了很多次type="number"的输入框限制，结果都是以失败告终。不是中英文输入法出问题，就是不兼容移动端，pc可以限制输入负数，可是到了移动端一下子就不行了。 最后看了很多教程，写了一个通用的方式来处理这种限制。 代码： <el-input v-model="loginForm.userName" @input="e => loginForm.userNam
van-field视图不变化+正则限制数据输入
weixin_52004060的博客
09-26 1557
v-model不能生效，所以监听输入事件并赋值 数据变了，视图不变，就加一个this.$nextTick()函数 <van-field @change="nameInput" :value='name' placeholder="请输入用户名"> </van-field> nameInput(e){ let val= e.detail.value
vue限制输入数字或者保留两位小数
总结前端开发中遇到的问题，分享前端知识
06-06 4100
总结原生input和vant限制输入数字或者保留两位小数方法
vue3输入框禁止输入小数点
10-14
可以通过监听输入事件，在输入小数点时阻止默认行为来实现禁止输入小数点的效果。具体代码如下： ```html <template> <input type="text" @input="handleInput"> </template> <script> export default { methods: { handleInput(event) { const value = event.target.value; if (value.includes('.')) { event.preventDefault(); } } } } </script> ```
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值