zoukankan      html  css  js  c++  java
  • 文本输入框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" onkeyup="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

  • 相关阅读:
    设计模式 ( 十七) 状态模式State(对象行为型)
    Intellij13 IDEA常用快捷键 (mac 10.5 +),优化,使用出现的问题汇总
    Web服务器及Web应用服务器
    阮一峰的网络日志
    双击退出的实现
    完成3DM以后的总结(2).Xutils的简单使用
    完成3DM以后的总结(1).PullToRefresh
    软考之路之j2se总结
    2013-2014年终总结
    牛腩新闻发布系统之获取IP
  • 原文地址:https://www.cnblogs.com/zhouyuxiang/p/8963599.html
Copyright © 2011-2022 走看看