文本输入框input将输入转换为统一大小写
转载地址:http://blog.csdn.net/yieryi_/article/details/52078596
文本输入框input将输入转换为统一大小写,通常有两种方法:JS和CSS方法。
1.JS方式
1).JS方式,通过监控key事件来做到。
key事件有三种: keydown event , keypress event, keyup event
ps:KeyDown触发后,不一定触发KeyUp,当KeyDown 按下后,拖动鼠标,那么将不会触发KeyUp事件。
2).KeyPress主要用来捕获数字(注意:包括Shift+数字的符号)、字母(注意:包括大小写)、小键盘等除了F1-12、SHIFT、Alt、Ctrl、Insert、Home、PgUp、Delete、End、PgDn、ScrollLock、Pause、NumLock、{菜单键}、{开始键}和方向键外的ANSI字符
3).KeyDown 和KeyUp 通常可以捕获键盘除了PrScrn所有按键(这里不讨论特殊键盘的特殊键)
4).KeyPress 只能捕获单个字符
5).KeyDown 和KeyUp 可以捕获组合键。
6).KeyPress 可以捕获单个字符的大小写
7).KeyDown和KeyUp 对于单个字符捕获的KeyValue 都是一个值,也就是不能判断单个字符的大小写。
8).KeyPress 不区分小键盘和主键盘的数字字符。
9).KeyDown 和KeyUp 区分小键盘和主键盘的数字字符。
10).其中PrScrn 按键KeyPress、KeyDown和KeyUp 都不能捕获。
11).在使用键盘的时候,通常会使用到CTRL+SHIFT+ALT 类似的组合键功能。对于此,我们如何来判定?
通过KeyUp 事件能够来处理(这里说明一下为什么不用KeyDown,因为在判定KeyDown的时候,CTRL、SHIFT和ALT 属于一直按下状态,然后再加另外一个键是不能准确捕获组合键,所以使用KeyDown 是不能准确判断出的,要通过KeyUp 事件来判定 )
12).捕获PrScrn按键事件
通过一种钩子的方式可以判定PrScrn 按键事件,钩子可以获取任何键盘事件
大小写转换样例:
<input name="htmer" type="text" οnkeyup="this.value=this.value.toUpperCase()" />
注:采用js方式还是会有转换过程的体现。如输入a,会先显示a然后触发keyup事件后,将a转换为A
2.CSS方式
CSS通过设置input输入框的style来实现。
- text-transform: uppercase /转为大写/
- text-transform: lowercase /转为小写/
- text-transform: capitalize /单词首字母转为大写/
使用样例:
<input type="text" style="*********; text-transform: uppercase;" name="textfield" />
推荐使用CSS方式,通过程序转换大小写,因为css方式视觉更友好。
参考:http://www.cnblogs.com/manongxiaobing/archive/2012/11/05/2755412.html
转载于:https://www.cnblogs.com/archermeng/p/7537182.html
文本输入框input将输入转换为统一大小写相关推荐
- 文本输入框input实现字母大小写转换
文本输入框input实现字母大小写转换,方法有两种: 1.通过js的onkeyup实现字母大小写转换 <input type="text" onkeyup="thi ...
- html 文本框输入,HTML文本框INPUT无法输入的解决
HTML文本框INPUT无法输入的解决 查看,READONLY和DISABLE属性都是OK的.. 在IE下是可以正常输入的的..但是在TT,等基于IE的浏览器下也无法输入..在FF,CHROME下输入 ...
- 用js使得输入框input只能输入数字
JS判断只能是数字和小数点 1.文本框只能输入数字代码(小数点也不能输入) <input οnkeyup="this.value=this.value.replace(/\D/g,'' ...
- 如何使输入框input只能输入数字
即:添加 οnkeyup="value=value.replace(/[^\d]/g,'')" 这里使用的正则表达式 较为简单.输入框后面添加个"只能输入数字" ...
- 让输入框input只能输入数字
在input上添加οnkeyup="value=value.replace(/[^\d]/g,'')"
- html文本框小数点,限制html文本框input只能输入数字和小数点
js 只能输入数字和小数点 function clearNoNum(obj){ obj.value = obj.value.replace(/[^\d.]/g,""); //清除& ...
- 可下拉选项可模糊查询的文本输入框
可下拉选项可模糊查询的文本输入框 ------------------------------------- 开发工具与关键技术:Visual Studio 2015 HTML5 作者:林敏静 撰写时 ...
- html文字下排输入,HTML input text单行文本输入框简介说明
摘要: 下文讲述html代码中input type='text'时的相关属性简介说明,如下所示: input type='text' 简介 当 input标签中 type='text'时,代表此标签是 ...
- Bootstrap 表单控件一(单行输入框input,下拉选择框select ,文本域textarea)
单行输入框,常见的文本输入框,也就是input的type属性值为text.在Bootstrap中使用input时也必须添加type类型,如果没有指定type类型,将无法得到正确的样式,因为Bootst ...
最新文章
- 怎样才能学好Vue,听听尤雨溪怎么说?
- 图解二叉树的先中后序遍历
- js java cookie_JS 打开一个模式窗口,使用Cookie传递一个参数
- linux 自动安装mysql数据库_Linux安装MySql数据库
- Elasticsearch2.3.2创建索引java代码及异常处理
- 小白初涉,先试试水。涉及Python,C语言基础,机器学习等
- (36)Verilog HDL关系运算:大于、小于、等于
- java 验证服务器宕机_java服务宕机原因查询
- Linux的原子操作与同步机制
- servlet-02-HTTP协议
- 三屏版知识竞赛类软件的开发需求分析及技术构思
- 浅谈接龙红包的技术实现
- 如何高效填写软件测试缺陷报告?(送缺陷报告模板)
- Arcgis学习视频
- 基于matlab实现数字图像处理之图像复原
- emwin emf格式视频生成环境搭建
- Echarts显示数据被遮挡了
- 第12节 DNS服务器部署与安全
- 如何把一张透明的图片做成不透明的
- linux中给普通用户添加root用户权限
热门文章
- JZ50第一个只出现一次的字符JZ50第一个只出现一次的字符JZ25合并两个排序的链表思路
- Linux系统管理(7)——Linux单用户模式详解 及应用场景
- 通向财务自由之路01_导读
- 数据库与Excel表格链接PHP,php读取Excel表格(Excel也可以做数据库)调用phpExcel类库...
- Python爬取千条相亲数据,看看单身率90%的中国男女都在挑剔什么
- 人人都是程序员?一边吐槽,一边却偷偷用,低代码工具真香
- 你根本不懂数据仓库!对于80%的大公司数仓只是地基,它才是房子
- 绩效管理这样做,成本减半,员工叫好!
- HashMap——ConcurrentHashMap
- oracle取时间间隔天,如何掌握 Oracle 中的时间间隔型数据(转)