牛逼!表单自动格式化

2023-10-25 10:58:39 浏览数 (2)

大家好,我是「前端实验室」爱分享的了不起~

今天,了不起发现了一个非常有用的宝藏插件:Cleave.js。提供一个简单的方法来格式化您的输入数据,以此增加输入字段的可读性。让你的页面表单使用体验感爆棚~

话不多说,直接来看!!

先睹为快

我们以表单中常需要格式化显示的例子作为展示。

日期

年-月-日的格式化。我们只需要正常输入数据“20201209”,表单自动格式化位“2020-12-09”

两位简写的日期格式月/年也是一样!

时间

对于时间个格式化,用于显示的情况比较多!

数值千分位格式化

通过千分位划分,数量级是不是非常清晰了呢?

Cleave.js简介

按照官网的介绍,就简单到一句话。

大道至简,真不是说说就行的~

Format your <input/> text content when you are typing. 格式化你的输入内容

根据上一部分的内容,我们可以知道 Cleave.js 就是帮助我们在输入的时候,边输入,边格式化

通过使用这个库,您不需要编写任何正则表达式来控制输入文本的格式。如果输入错误的内容,这些错误的内容是不会显示的,连校验和验证都省略了。然而,这并不意味着取代任何验证或掩码库,你仍应在后端验证数据。毕竟它只管表单上的显示内容

0 人点赞