js输入框字符宽度判断-已知字符串宽度/未知字符串宽度

一、需求说明

一串字符长度很好判断,this.text.length就拿到了,但是对于一个固定宽度的文本框,要求不能超过宽度,那么就要计算这行文本的宽度。汉字是等宽字符,但是数字和英文则宽度不一致,这里的建议是,以数字为单位,比如1,那么一行最多输入20的汉子,长度则为20,字母则要按照最宽的字符w去计算,数字则以5为单位去计算。

二、解决方案

情形一:已知的字符串宽度,根据要求截取固定宽度的字符串,比如我已经知道了一串字符串了,去截取固定的宽度

方法一:

 

方法二:

情形二:未知字符串的宽度,根据动态输入的字符判断当前的宽度,根据输入框宽度截取能显示的最多字符长度,比如一个输入框固定了长度,每输入一个字符后则判断是否超过,超过后就截去超过的部分

按照比例,汉字宽度为1,则英文为0.89,数字为0.57,符号(比如=?)

 

 

 

欢迎转载,转载需带着文章出处链接~~

发表评论

邮箱地址不会被公开。

此站点使用Akismet来减少垃圾评论。了解我们如何处理您的评论数据