需求: 用户在input中输入内容时,输入的是小写的英文,系统需要自动转换成大写,边输入边转换。
看到这个需求,就直接给input绑定@input事件,然后在input事件中去调用js的toUpperCase() 。这样处理不仅繁琐还会导致很多bug, 尤其是vue项目。后来,发现一个css竟然可以实现这个功能,真是太神奇了。它就是
text-transform:uppercase; // 仅大写
text-transform:lowercase; // 仅小写
需求: 用户在input中输入内容时,输入的是小写的英文,系统需要自动转换成大写,边输入边转换。
看到这个需求,就直接给input绑定@input事件,然后在input事件中去调用js的toUpperCase() 。这样处理不仅繁琐还会导致很多bug, 尤其是vue项目。后来,发现一个css竟然可以实现这个功能,真是太神奇了。它就是
text-transform:uppercase; // 仅大写
text-transform:lowercase; // 仅小写