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中的事件处理
Jan 16 Javascript
js 加载时自动调整图片大小
May 28 Javascript
DOM Scripting中的图片切换[兼容Firefox]
Jun 12 Javascript
JQuery中each()的使用方法说明
Aug 19 Javascript
jBox 2.3基于jquery的最新多功能对话框插件 常见使用问题解答
Nov 10 Javascript
JQuery的自定义事件代码,触发,绑定简单实例
Aug 01 Javascript
JavaScript将页面表格导出为Excel的具体实现
Dec 27 Javascript
jquery选择checked在ie8普通模式下的问题
Feb 12 Javascript
微信小程序实现运动步数排行功能(可删除)
Jul 05 Javascript
原生js实现二级联动菜单
Nov 27 Javascript
基于javascript处理nginx请求过程详解
Jul 07 Javascript
JavaScript原生数组函数实例汇总
Oct 14 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中将一段数据存到一个txt文件中并显示其内容
2014/08/15 PHP
thinkPHP中配置的读取与C方法详解
2016/12/05 PHP
laravel 数据验证规则详解
2019/10/23 PHP
两个SUBMIT按钮,如何区分处理
2006/08/22 Javascript
URI、URL和URN之间的区别与联系
2006/12/20 Javascript
W3C Group的JavaScript1.8 新特性介绍
2009/05/19 Javascript
JavaScript格式化日期时间的方法和自定义格式化函数示例
2014/04/04 Javascript
jQuery修改class属性和CSS样式整理
2015/01/30 Javascript
详解JavaScript的AngularJS框架中的作用域与数据绑定
2016/03/04 Javascript
微信小程序 Storage API实例详解
2016/10/02 Javascript
AngularJS实现自定义指令与控制器数据交互的方法示例
2017/06/19 Javascript
JS鼠标3次点击事件实现代码及扩展思路
2017/09/12 Javascript
vue项目tween方法实现返回顶部的示例代码
2018/03/02 Javascript
jQuery实现遍历XML节点和属性的方法示例
2018/04/29 jQuery
微信小程序实现提交input信息到后台的方法示例
2019/01/19 Javascript
浅谈JavaScript_DOM学习篇_图片切换小案例
2019/03/19 Javascript
AjaxFileUpload.js实现异步上传文件功能
2019/04/19 Javascript
Vue源码之关于vm.$delete()/Vue.use()内部原理详解
2019/05/01 Javascript
js实现随机数小游戏
2019/06/28 Javascript
vue实现路由监听和参数监听
2019/10/29 Javascript
nodejs实现百度舆情接口应用示例
2020/02/07 NodeJs
Vue组件简易模拟实现购物车
2020/12/21 Vue.js
Python中max函数用于二维列表的实例
2018/04/03 Python
TensorFlow Saver:保存和读取模型参数.ckpt实例
2020/02/10 Python
django 实现手动存储文件到model的FileField
2020/03/30 Python
TensorFlow中如何确定张量的形状实例
2020/06/23 Python
Python getsizeof()和getsize()区分详解
2020/11/20 Python
复古风格的女装和装饰品:ModCloth
2017/12/29 全球购物
英国网上超市:Ocado
2020/03/05 全球购物
毕业生个人投资创业计划书
2014/01/04 职场文书
科学发展观活动总结
2014/08/28 职场文书
农村党员对照检查材料
2014/09/24 职场文书
明确岗位职责
2015/02/14 职场文书
python中的被动信息搜集
2021/04/29 Python
Golang全局变量加锁的问题解决
2021/05/08 Golang
python和Appium的移动端多设备自动化测试框架
2022/04/26 Python