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 相关文章推荐
JavaScript 学习笔记(四)
Dec 31 Javascript
js 创建书签小工具之理论
Feb 25 Javascript
可选择和输入的下拉列表框示例
Nov 05 Javascript
js面向对象编程之如何实现方法重载
Jul 02 Javascript
举例讲解JavaScript substring()的使用方法
Nov 09 Javascript
浅谈angularJS中的事件
Jul 12 Javascript
BootStrap table使用方法分析
Nov 08 Javascript
解决angularJS中input标签的ng-change事件无效问题
Sep 13 Javascript
微信小程序module.exports模块化操作实例浅析
Dec 20 Javascript
详解js创建对象的几种方法及继承
Apr 12 Javascript
vue+高德地图写地图选址组件的方法
May 18 Javascript
在VUE style中使用data中的变量的方法
Jun 19 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
修改Zend引擎实现PHP源码加密的原理及实践
2008/04/14 PHP
php学习 函数 课件
2008/06/15 PHP
php 静态变量与自定义常量的使用方法
2010/01/26 PHP
php session和cookie使用说明
2010/04/07 PHP
php图片缩放实现方法
2014/02/20 PHP
Laravel中前端js上传图片到七牛云的示例代码
2017/09/04 PHP
页面中body onload 和 window.onload 冲突的问题的解决
2009/07/01 Javascript
基于jQuery的消息提示插件之旅 DivAlert(三)
2010/04/01 Javascript
JavaScript学习笔记之内置对象
2015/01/22 Javascript
NodeJS学习笔记之Connect中间件模块(一)
2015/01/27 NodeJs
JavaScript实现的简单拖拽效果
2015/06/01 Javascript
JS实现新浪微博效果带遮罩层的弹出框代码
2015/10/12 Javascript
JavaScript知识点总结(六)之JavaScript判断变量数据类型
2016/05/31 Javascript
js中的关联数组与普通数组详解
2016/07/27 Javascript
AngularJS Select(选择框)使用详解
2017/01/18 Javascript
bootstrap响应式工具使用详解
2017/11/29 Javascript
开发Vue树形组件的示例代码
2017/12/21 Javascript
JavaScript原型链与继承操作实例总结
2018/08/24 Javascript
JS实现可视化文件上传
2018/09/08 Javascript
jQuery实现的鼠标拖动画矩形框示例【可兼容IE8】
2019/05/17 jQuery
Nodejs libuv运行原理详解
2019/08/21 NodeJs
详解在vue-cli3.0中自定css、js和图片的打包路径
2019/08/26 Javascript
深入浅析vue中cross-env的使用
2019/09/12 Javascript
vue路由拦截器和请求拦截器知识点总结
2019/11/08 Javascript
webpack DllPlugin xxx is not defined解决办法
2019/12/13 Javascript
vue制作toast组件npm包示例代码
2020/10/29 Javascript
Python enumerate遍历数组示例应用
2008/09/06 Python
基于Django用户认证系统详解
2018/02/21 Python
Python多线程中阻塞(join)与锁(Lock)使用误区解析
2018/04/27 Python
浅析PEP570新语法: 只接受位置参数
2019/10/15 Python
python opencv将表格图片按照表格框线分割和识别
2019/10/30 Python
python验证码图片处理(二值化)
2019/11/01 Python
通过实例简单了解python yield使用方法
2020/08/06 Python
Schutz鞋官方网站:Schutz Shoes
2017/12/13 全球购物
No7 Beauty美国官网:英国国民护肤品牌
2019/10/31 全球购物
本科毕业生应聘求职信
2014/07/06 职场文书