当前位置: 首页 > news >正文

input、el-input输入框输入规则

一、input

只能输入框只能输入正整数,输入同时禁止了以0开始的数字输入,防止被转化为其他进制的数值。
<!-- 不能输入零时-->
<input type='text' οninput="value=value.replace(/^(0+)|[^\d]+/g,'')"><!-- 能输入零时-->
<input type='text' οninput="value=value.replace(/^0+(\d)|[^\d]+/g,'')">
附:只能输入中文:
<input type="text" οninput="this.value=this.value.replace(/[^\u4e00-\u9fa5]/g,'')">  
附:只能输入英文:
<input type="text" οninput="this.value=this.value.replace(/[^a-zA-Z]/g,'')">  

二、el-input

<el-input size="small"οnkeyup="value=value.replace(/^(0+)|[^\d]+/g,'')"v-model="count"maxlength="9"></el-input>
data() {return {count: 0}
}

el-input输入金额,保留两位小数

需求:“只允许输入金额保留两位小数”,有2种实现方法
方法一(通过正则控制):
<el-inputv-model="inputTable.amount"@input="formatNum(form.amount, 'amount')"
></el-input>
formatNum(val, key) {let temp = val.toString();temp = temp.replace(/。/g, ".");temp = temp.replace(/[^\d.]/g, ""); //清除"数字"和"."以外的字符temp = temp.replace(/^\./g, ""); //验证第一个字符是数字temp = temp.replace(/\.{2,}/g, ""); //只保留第一个, 清除多余的temp = temp.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");temp = temp.replace(/^(\-)*(\d+)\.(\d\d).*$/, "$1$2.$3"); //只能输入两个小数this.form[key] = temp;
},

方法二(使用组件):

这个是我最近才发现的,方便多了TT
设置精度precision,即可四舍五入;
再改改样式,隐藏按钮,靠左对齐,最后效果和普通的input无异

 <el-input-number v-model="num" :precision="2"></el-input-number>

相关文章:

input、el-input输入框输入规则

一、input 只能输入框只能输入正整数&#xff0c;输入同时禁止了以0开始的数字输入&#xff0c;防止被转化为其他进制的数值。 <!-- 不能输入零时--> <input typetext οninput"valuevalue.replace(/^(0)|[^\d]/g,)"><!-- 能输入零时--> <inp…...

Qt优秀开源项目之十九:跨平台记事本Notes

官网&#xff1a;https://www.get-notes.com github&#xff1a;https://github.com/nuttyartist/notes 一.特性 1.完全基于Qt和C 2.完全开源和跨平台&#xff08;Linux、macOS、Windows&#xff09; 3.运行速度快&#xff0c;界面美如画 4.支持Markdown 5.支持使用嵌套文件夹…...

[足式机器人]Part4 南科大高等机器人控制课 Ch03 Operator View of Rigid-Body Transformation

本文仅供学习使用 本文参考&#xff1a; B站&#xff1a;CLEAR_LAB 笔者带更新-运动学 课程主讲教师&#xff1a; Prof. Wei Zhang 南科大高等机器人控制课 Ch03 Operator View of Rigid-Body Transformation 1. Rotation Operation via Differential Equation1.1 Skew Symmetr…...

SpringBoot项目静态资源默认访问目录

SpringBoot项目&#xff1a;静态资源默认访问目录 参考博客&#xff1a;https://blog.csdn.net/weixin_43808717/article/details/118281904...

xtu oj 1255 勾股数

题目描述 勾股数是指满足a2b2c2的正整数&#xff0c;比如最有名的“勾三股四弦五”。 现在给你两个正整数,请问是否存在另外一个正整数&#xff0c;使其成为“勾股数”&#xff1f; 输入 第一行是一个整数K&#xff0c;表示样例的个数。 以后每行一个样例&#xff0c;为两个…...

【ArcGIS Pro微课1000例】0051:创建数据最小几何边界范围(点、线、面数据均可)

本实例为专栏系统文章:创建点数据最小几何边界(范围),配套案例数据,持续同步更新! 文章目录 一、工具介绍二、实战演练三、注意事项一、工具介绍 创建包含若干面的要素类,用以表示封闭单个输入要素或成组的输入要素指定的最小边界几何。 工具界面及参数如下所示: 核心…...

Oracle 怎樣修改DB_NAME

DBNEWID 是一个数据库实用程序&#xff0c;用于更改 Oracle 数据库的 DBNAME 和 DBID。可以更改 DBID 或 DBNAME 或两者。 DBNAME 是在创建数据库时指定的数据库名称&#xff0c;DBID 是创建数据库时分配给数据库的唯一编号。 以下步骤演示如何使用 DBNEWID 实用程序更改 Oracl…...

git标签的管理与思考

git 标签管理 git 如何打标签呢&#xff1f; 标签是什么? 标签 相当于一个 版本管理的一个贴纸&#xff0c;随时 可以通过标签 切换到 这个版本的状态 &#xff0c; 有人可能有疑问 git commit 就可以知道 代码的改动了&#xff0c; 为啥还需要标签来管理呢&#xff1f; …...

ESP32网络编程-OTA方式升级固件(基于Arduino IDE)

OTA方式升级固件(基于Arduino IDE) 文章目录 OTA方式升级固件(基于Arduino IDE)1、ESP32的OTA介绍2、OTA升级固件方式3、软件准备4、硬件准备5、代码实现ESP32吸引人的编程方式之一就是通过OTA方式升级固件。本文将详细介绍在Arduino IDE中升级固件。 1、ESP32的OTA介绍 O…...

力扣-151. 反转字符串中的单词

文章目录 看下去&#xff0c;你一定可以理解此题&#xff0c;写的简单易懂力扣题目解题思路函数构成1.反转函数2.消除掉多余空格函数 整体函数 看下去&#xff0c;你一定可以理解此题&#xff0c;写的简单易懂 力扣题目 给你一个字符串 s &#xff0c;请你反转字符串中 单词 …...

VSCode Keil Assintant 联合开发STM32

文章目录 VSCodeKeil AssistantUV5&#x1f947;软件下载&#x1f947;配置环境&#x1f947;插件安装&#x1f948;C/C Extension Pack&#x1f949;C/C Extension Pack介绍&#x1f949;插件安装 &#x1f948;Keil Assistant&#x1f949;Keil Assistant介绍&#x1f949;插…...

华为交换机基本配置

一、配置时间 sys ntp-service unicast-server 192.168.1.1 ntp-service unicast-server 192.168.1.2 clock timezone UTC add 8 clock timezone CST add 08:00:00 undo ntp-service disable q手动设置一个时间 clock datetime 13:43:00 2023-10-10save ysys保存&#xff01;保…...

每天一个Linux命令 -- (7)more命令

欢迎阅读《每天一个Linux命令》系列&#xff01;在本篇文章中&#xff0c;将介绍Linux系统下的more命令&#xff0c;它用于逐屏显示文件的内容。 概念 more命令是Linux系统下的文件逐屏显示命令&#xff0c;用于逐屏显示文件的内容。 命令操作 more命令的语法如下&#xff1…...

JUnit 之初体验

文章目录 1.定义2.引入1&#xff09;使用 Maven 工具2&#xff09;使用 Gradle 工具3&#xff09;使用 Jar 包 2.样例0&#xff09;前提1&#xff09;测试类2&#xff09;测试方法3&#xff09;测试断言4&#xff09;实施 总结 1.定义 JUnit 是一个流行的 Java 单元测试框架&a…...

【前端设计模式】之适配器模式

适配器模式是一种常见的设计模式&#xff0c;用于将一个类的接口转换成客户端所期望的另一个接口。在前端开发中&#xff0c;适配器模式可以帮助我们解决不同框架或库之间的兼容性问题&#xff0c;提高代码的复用性和可维护性。 适配器模式特性 适配器类&#xff1a;适配器类…...

【数据结构】循环队列

&#x1f984;个人主页:修修修也 &#x1f38f;所属专栏:数据结构 ⚙️操作环境:Visual Studio 2022 目录 &#x1f38f;队列顺序存储的不足 &#x1f38f;循环队列的定义 &#x1f38f;设计循环队列 结语 &#x1f38f;队列顺序存储的不足 我们假设用一个可以存放为n个数据…...

Docker的资源控制

Docker的资源控制&#xff1a; 对容器使用宿主机的资源进行限制&#xff0c;Docker 通过 Cgroup 来控制容器使用的资源配额&#xff0c;包括 CPU 内存 磁盘i/o Docker 使用Linux自带的功能cgroup&#xff0c;Cgroup 是 ControlGroups 的缩写 C crontrol groups是Linux内核…...

SpringBoot 自动装配原理详解

什么是 SpringBoot 自动装配&#xff1f; 我们现在提到自动装配的时候&#xff0c;一般会和 Spring Boot 联系在一起。但是&#xff0c;实际上 Spring Framework 早就实现了这个功能。Spring Boot 只是在其基础上&#xff0c;通过 SPI 的方式&#xff0c;做了进一步优化。 Spr…...

深度探索Linux操作系统 —— 构建initramfs

系列文章目录 深度探索Linux操作系统 —— 编译过程分析 深度探索Linux操作系统 —— 构建工具链 深度探索Linux操作系统 —— 构建内核 深度探索Linux操作系统 —— 构建initramfs 文章目录 系列文章目录前言一、为什么需要 initramfs二、initramfs原理探讨三、构建基本的init…...

使用cmake构建Qt6.6的qt quick项目,添加应用程序图标的方法

最近&#xff0c;在学习qt的过程中&#xff0c;遇到了一个难题&#xff0c;不知道如何给应用程序添加图标&#xff0c;按照网上的方法也没有成功&#xff0c;后来终于自己摸索出了一个方法。 1、准备一张图片作为图标&#xff0c;保存到工程目录下面&#xff0c;如logo.ico。 …...

【Axure高保真原型】引导弹窗

今天和大家中分享引导弹窗的原型模板&#xff0c;载入页面后&#xff0c;会显示引导弹窗&#xff0c;适用于引导用户使用页面&#xff0c;点击完成后&#xff0c;会显示下一个引导弹窗&#xff0c;直至最后一个引导弹窗完成后进入首页。具体效果可以点击下方视频观看或打开下方…...

<6>-MySQL表的增删查改

目录 一&#xff0c;create&#xff08;创建表&#xff09; 二&#xff0c;retrieve&#xff08;查询表&#xff09; 1&#xff0c;select列 2&#xff0c;where条件 三&#xff0c;update&#xff08;更新表&#xff09; 四&#xff0c;delete&#xff08;删除表&#xf…...

椭圆曲线密码学(ECC)

一、ECC算法概述 椭圆曲线密码学&#xff08;Elliptic Curve Cryptography&#xff09;是基于椭圆曲线数学理论的公钥密码系统&#xff0c;由Neal Koblitz和Victor Miller在1985年独立提出。相比RSA&#xff0c;ECC在相同安全强度下密钥更短&#xff08;256位ECC ≈ 3072位RSA…...

C# SqlSugar:依赖注入与仓储模式实践

C# SqlSugar&#xff1a;依赖注入与仓储模式实践 在 C# 的应用开发中&#xff0c;数据库操作是必不可少的环节。为了让数据访问层更加简洁、高效且易于维护&#xff0c;许多开发者会选择成熟的 ORM&#xff08;对象关系映射&#xff09;框架&#xff0c;SqlSugar 就是其中备受…...

tree 树组件大数据卡顿问题优化

问题背景 项目中有用到树组件用来做文件目录&#xff0c;但是由于这个树组件的节点越来越多&#xff0c;导致页面在滚动这个树组件的时候浏览器就很容易卡死。这种问题基本上都是因为dom节点太多&#xff0c;导致的浏览器卡顿&#xff0c;这里很明显就需要用到虚拟列表的技术&…...

鸿蒙(HarmonyOS5)实现跳一跳小游戏

下面我将介绍如何使用鸿蒙的ArkUI框架&#xff0c;实现一个简单的跳一跳小游戏。 1. 项目结构 src/main/ets/ ├── MainAbility │ ├── pages │ │ ├── Index.ets // 主页面 │ │ └── GamePage.ets // 游戏页面 │ └── model │ …...

【免费数据】2005-2019年我国272个地级市的旅游竞争力多指标数据(33个指标)

旅游业是一个城市的重要产业构成。旅游竞争力是一个城市竞争力的重要构成部分。一个城市的旅游竞争力反映了其在旅游市场竞争中的比较优势。 今日我们分享的是2005-2019年我国272个地级市的旅游竞争力多指标数据&#xff01;该数据集源自2025年4月发表于《地理学报》的论文成果…...

Appium下载安装配置保姆教程(图文详解)

目录 一、Appium软件介绍 1.特点 2.工作原理 3.应用场景 二、环境准备 安装 Node.js 安装 Appium 安装 JDK 安装 Android SDK 安装Python及依赖包 三、安装教程 1.Node.js安装 1.1.下载Node 1.2.安装程序 1.3.配置npm仓储和缓存 1.4. 配置环境 1.5.测试Node.j…...

2025.6.9总结(利与弊)

凡事都有两面性。在大厂上班也不例外。今天找开发定位问题&#xff0c;从一个接口人不断溯源到另一个 接口人。有时候&#xff0c;不知道是谁的责任填。将工作内容分的很细&#xff0c;每个人负责其中的一小块。我清楚的意识到&#xff0c;自己就是个可以随时替换的螺丝钉&…...

RushDB开源程序 是现代应用程序和 AI 的即时数据库。建立在 Neo4j 之上

一、软件介绍 文末提供程序和源码下载 RushDB 改变了您处理图形数据的方式 — 不需要 Schema&#xff0c;不需要复杂的查询&#xff0c;只需推送数据即可。 二、Key Features ✨ 主要特点 Instant Setup: Be productive in seconds, not days 即时设置 &#xff1a;在几秒钟…...