vue如何限制只能输入正负数及小数


Posted in Javascript onJuly 04, 2019

 <el-input keyup.native="isFloor"/>

//正数,含小数

isFloor(e,type){
   if(type=='floor') {
    var val=e.target.value;
    //限制只能输入一个小数点
    if (val.indexOf(".") != -1) {
     var str = val.substr(val.indexOf(".") + 1);
     if (str.indexOf(".") != -1) {
      val = val.substr(0, val.indexOf(".") + str.indexOf(".") + 1);
     }
    }
    e.target.value = val.replace(/[^\d^\.]+/g,'');
   }
   
  },
//正负数,含小数

isFloor(){
 var obj=event.target;
 var t = obj.value.charAt(0); 
 obj.value = obj.value.replace(".", "$#$")//把第一个字符'.'替换成'$#$'
               .replace(/\./g, "")//把其余的字符'.'替换为空
               .replace("$#$", ".")//把字符'$#$'替换回原来的'.'
               .replace(/[^\d.]/g, "")//只能输入数字和'.'
               .replace(/^\./g, "")//不能以'.'开头
               .replace( /([0-9]+\.[0-9]{2})[0-9]*/,"$1")//只保留2位小数  
 if (t == '-') {
  obj.value = '-' + obj.value;
 } 
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JS构建页面的DOM节点结构的实现代码
Dec 09 Javascript
Js实现滚动变色的文字效果
Jun 16 Javascript
使用JQuery 加载页面时调用JS的实现方法
May 30 Javascript
js友好的时间返回函数
Aug 24 Javascript
深入学习Bootstrap表单
Dec 13 Javascript
js 简易版滚动条实例(适用于移动端H5开发)
Jun 26 Javascript
Javascript 之封装(Package)
Sep 14 Javascript
详解关于Vue2.0路由开启keep-alive时需要注意的地方
Sep 18 Javascript
vue将单页面改造成多页面应用的方法
Nov 25 Javascript
微信小程序自定义底部导航带跳转功能
Nov 27 Javascript
解决element ui select下拉框不回显数据问题的解决
Feb 20 Javascript
layui导出所有数据的例子
Sep 10 Javascript
Vue项目中ESlint规范示例代码
Jul 04 #Javascript
你或许不知道的一些npm实用技巧
Jul 04 #Javascript
中高级前端必须了解的JS中的内存管理(推荐)
Jul 04 #Javascript
angular6开发steps步骤条组件
Jul 04 #Javascript
13 个npm 快速开发技巧(推荐)
Jul 04 #Javascript
微信小程序在线客服自动回复功能(基于node)
Jul 03 #Javascript
解决vue打包后vendor.js文件过大问题
Jul 03 #Javascript
You might like
解析php获取字符串的编码格式的方法(函数)
2013/06/21 PHP
用 Composer构建自己的 PHP 框架之基础准备
2014/10/30 PHP
php准确计算复活节日期的方法
2015/04/18 PHP
PHP中用Trait封装单例模式的实现
2019/12/18 PHP
javascript 命名空间以提高代码重用性
2008/11/13 Javascript
jQuery中extend函数详解
2015/07/13 Javascript
freemarker判断对象是否为空的方法
2015/08/13 Javascript
如何动态加载外部Javascript文件
2015/12/02 Javascript
jQuery实现div横向拖拽排序的简单实例
2016/07/13 Javascript
BootStrap按钮标签及基本样式
2016/11/23 Javascript
详解VUE的状态控制与延时加载刷新
2017/03/27 Javascript
javascript实现二叉树的代码
2017/06/08 Javascript
vue2组件之select2调用的示例代码
2017/10/12 Javascript
Vuex中实现数据状态查询与更改
2019/11/08 Javascript
ant-design-vue 快速避坑指南(推荐)
2020/01/21 Javascript
基于JS正则表达式实现模板数据动态渲染(实现思路详解)
2020/03/07 Javascript
微信小程序实现星星评分效果
2020/11/01 Javascript
vue 解决IOS10低版本白屏的问题
2020/11/17 Javascript
[09:31]2016国际邀请赛中国区预选赛Yao赛后采访 答题送礼
2016/06/27 DOTA
[08:47]2018国际邀请赛 OG战队举杯时刻
2018/08/29 DOTA
Python字符转换
2008/09/06 Python
python实现list元素按关键字相加减的方法示例
2017/06/09 Python
python实现读Excel写入.txt的方法
2018/04/29 Python
Django使用详解:ORM 的反向查找(related_name)
2018/05/30 Python
利用python循环创建多个文件的方法
2018/10/25 Python
python运行时强制刷新缓冲区的方法
2019/01/14 Python
python原类、类的创建过程与方法详解
2019/07/19 Python
django 实现将本地图片存入数据库,并能显示在web上的示例
2019/08/07 Python
CSS3 制作绽放的莲花采用效果叠加实现
2013/01/31 HTML / CSS
Html5游戏开发之乒乓Ping Pong游戏示例(三)
2013/01/21 HTML / CSS
网购亚洲时装、美容产品和生活百货:YesStyle
2016/09/15 全球购物
Timberland俄罗斯官方网上商店:全球领先的户外品牌
2020/03/15 全球购物
纬创Java面试题笔试题
2014/10/02 面试题
请假条标准格式规范
2014/04/10 职场文书
党支部对转正的意见
2015/06/02 职场文书
初二英语教学反思
2016/02/15 职场文书