首页 > 其他分享 >elementUI input只能输入数字、小数的几种方法

elementUI input只能输入数字、小数的几种方法

时间:2023-04-10 19:45:42浏览次数:50  
标签:数字 elementUI value input 输入 小数

elementUI input只能输入数字、小数的几种方法
原文链接:https://blog.csdn.net/weixin_42397937/article/details/123297108

elementUI文本框input设置仅可输入数字或者小数的几种方法

一、设置type=“number”

这个属性可以帮助我们限制文本框输入的文本只能是数字或者小数,但是会跟随一个默认的样式,我们需要把默认样式删掉

代码:

<style>
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}
input[type="number"] {
  -moz-appearance: textfield;
}
</style>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10

演示样例:

修改之前

在这里插入图片描述

修改之后

在这里插入图片描述

二、设置oninput属性

代码如下:

oninput ="value=value.replace(/[^0-9.]/g,'')"
  • 1

大概意思就是除了数字0-9的全部替换为’’,改良一下代码,增加输入小数点几位数判断

 oninput="if(isNaN(value)) { value = null } if(value.indexOf('.')>0){value=value.slice(0,value.indexOf('.')+3)}"
  • 1
  • 2

标签:数字,elementUI,value,input,输入,小数
From: https://www.cnblogs.com/sunny3158/p/17304092.html

相关文章

  • 监听 input type=file 文件上传取消事件
    在做项目的时候,需要根据是否上传图片,(前提是已经上传文件,再次上传取消时,监听取消事件)进而判断页面变化。通过查阅相关资料,发现change事件并不能监听取消,于是从另外一种角度:判断上传的文件是否有值,进而监听取消事件。代码如下:<inputtype="file"name="file"id="fileToUpload"a......
  • 如何去掉echarts饼图小数点
    series : {                         name : '票数占比' ,                         type : 'pie' ,                         radius  :   '72%' , //设置饼图大小     ......
  • nohup: ignoring input and redirecting stderr to stdout
    把后面的“&”改成“2>&1&”,把启动命令改成如下:nohupjava-jareureka-server.jar>../logs/eureka-server.out2>&1&再次执行,问题解决。解释如下:2>表示把标准错误(stderr)重定向,标准输出(stdout)是1。尖括号后面可以跟文件名,或者是&1,&2,分别表示重定向到标准输出......
  • 编程:利用 FileInputStream 和 FileOutputStream,完成下面的要
    (1)用FileOutputStream往当前目录下“test.txt”文件中写入“HelloWorld”;(2)利用FileInputStream读入test.txt文件,并在控制台上打印出test.txt中的内容。(3)要求用try-catch-finally处理异常,并且关闭流应放在finally块中。代码实现:importjava.io.FileInput......
  • 【Java】FileInputStream和FileOutputStream基本使用
    文章目录InputStream-字节输入流1.FileInputStream介绍2.FileOutputStream介绍3.文件的拷贝IO流-体系图文件VS流InputStream-字节输入流InputStream抽象类是所有类字节输入流的超类InputStream常用的子类FileInputStream:文件输入流BufferedInputStream:缓冲字节输入流O......
  • Vue进阶(四十九):在Webapp上使用input:file, 指定capture属性调用默认相机,摄像,录音功能
    在webapp上使用input:file,指定capture属性调用默许相机,摄像,录音功能。在webapp上使用input:file,指定capture属性调用默认相机,摄像,录音功能在iOS6下开发webapp,使用input之file,很有用<inputtype="file"accept="image/*"capture="camera"><inputtype="file"acce......
  • elemenut的el-input限制只能输入数字
    限制只能输入整数关键代码:只能输入整数:oninput="this.value=this.value.replace(/[^0-9]/g,'');"只能输入整数且长度小于7:oninput="if(this.value.length>7){this.value=this.value.slice(0,7)}else{this.value=this.value.replace(/[^0-9]/g,'&#......
  • elementui table 禁用部分多选框
    //禁用多选checkboxT(row){if(row.bomDetailParentId==0){returntrue;//禁用}else{returnfalse;//不禁用}},<el-table-columntype="selection"width="55"......
  • 用 Go 剑指 Offer 11. 旋转数组的最小数字
    已知一个长度为n的数组,预先按照升序排列,经由1到n次旋转后,得到输入数组。例如,原数组nums=[0,1,4,4,5,6,7]在变化后可能得到:若旋转4次,则可以得到[4,5,6,7,0,1,4]若旋转7次,则可以得到[0,1,4,4,5,6,7]注意,数组[a[0],a[1],a[2],...,a[n-1]]旋转一次的结果为数......
  • java.nio.charset.MalformedInputException: Input length = 1
    将nacos作为配置中心时,发现加载nacos内容时报错:java.nio.charset.MalformedInputException:Inputlength=1后来发现,将项目统一为utf-8后,正常启动。 ......