方法1:使用JS

<input name="text" type="text" onkeyup="this.value=this.value.toUpperCase()" />

方法2:使用CSS

<input name="t1" type="text" style="text-transform:uppercase;" />

text-transform的取值有4个:

  1. none:默认值,不会发生任何转换
  2. capitalize:每个单词的首字母大写。
  3. uppercase:大写转换。
  4. lowercase:小写转换。

两者区别:

  • 区别1:用户体验

方法1(JS)方法在使用时,会给用户一种转换感,用户体验不如第二种方法。

  • 区别2:value是否大写

方法1(JS)方法可以将页面的text值及value值均修改为大写,而第二种方法只能讲显示的修改为大写(其本质是CSS),因此需要转为大写的,仍然需要在后台将转为大写。

建议

在界面中使用方法二,传给后台时,再进行大写转换。

input输入自动大写的更多相关文章

  1. DataList:HTML5中的input输入框自动提示宝器

    DataList的作用是在你往input输入框里输入信息时,根据你敲进去的字母,自动显示一个提示下列列表,很像百度或谷歌的搜索框的自动提示,在飞机票火车票的搜索页面上也有这样的效果.它是HTML5里新 ...

  2. 如何让input框自动获得焦点

    项目中有个需求  一个用扫描枪输入的input框 为了避免每次都需要人为点击 需要做成当打开页面时该input框自动获取焦点 <input type="text" name= ...

  3. jquery 实现邮箱输入自动提示功能:(二)

    上篇文章写到了一个不错的jquery实现邮箱输入自动提示功能,发现还有一个不错的自动提示插件: 先展示结果如图: html代码: <center> <h1>输入邮箱试试!< ...

  4. jquery 实现邮箱输入自动提示功能:(一)

    记得去年做某个项目的时候,用到了邮箱输入自动提示功能,于是网上搜了一下,发现了这个写得不错,现在回想起来,转载一下,方便查阅. 邮箱的广泛使用得益于它的免费,因此很多网站在注册的时候都会直接使用邮箱作 ...

  5. jQuery实现用户输入自动完成功能

    jQuery实现用户输入自动完成功能 利用jQuery UI中Auto-complete插件实现输入自动完成功能,大家在使用诸如淘宝.京东等电商平台搜索商品时,往往只要输入商品的一些特殊字符,就可以显 ...

  6. 实时监听input输入内容的N种方法

    现在有一个需求,需要我们实时监听input输入框中的内容,从而带来更好的用户体验,而不是等我们全部输入完毕才告诉我们格式不对首先我们创建一个input输入框 <form name='loginF ...

  7. 正则表达式控制Input输入内容 ,js正则验证方法大全

    https://blog.csdn.net/xushichang/article/details/4041507 //输入姓名的正则校验 e.currentTarget.value = e.curre ...

  8. input输入样式,动画

    模板描述:input输入样式 动画,有输入框也有搜索框的样式,多种多样,大家根据自己的喜欢来. 找网站SEO教程,网站模板,以及想要建立个人博客的朋友来涂志海个人博客网,这里有你想要的一切(万一没有的 ...

  9. input输入子系统

    一.什么是input输入子系统? 1.Linux系统支持的输入设备繁多,例如键盘.鼠标.触摸屏.手柄或者是一些输入设备像体感输入等等,Linux系统是如何管理如此之多的不同类型.不同原理.不同的输入信 ...

随机推荐

  1. UVa 10523 - Very Easy !!!

    题目大意:给你一个公式,直接按照式子计算就可以了,要用到大数. import java.io.*; import java.util.*; import java.math.*; class Main ...

  2. 温故知新 javascript 正则表达式

    很长时间没看 正则表达式了,碰巧今天用到,温故知新了一把 看书学习吧 50% 的举一反三练习中的原创.   一 javascript正则表达式的基本知识 1     javascript 正则对象创建 ...

  3. 利用 Grunt (几乎)无痛地做前端开发 (一)之单元测试

    前言 如果你想开发一个js应用,甭管多简单,都要先创建整个宇宙 来看看我们的Javascript小宇宙: 确定如何根据需求.功能划分模块,如何将代码分成多个文件开发,合成一个发布 保证上一条的同时,使 ...

  4. 【python之路12】三元运算符(if)

    1.三元运算符条件语句 普通if条件是这样写的: n = 1 if n > 0: st = '大于0' else: st = '小于等于0' print(st) 三元运算符的写法: n = 1 ...

  5. 细数JDK里的设计模式

    原文出处: javacodegeeks   译文出处:deepinmind 这也是篇老文了,相信很多人也看过.前面那些废话就不翻译了,直接切入正题吧~ 结构型模式: 适配器模式: 用来把一个接口转化成 ...

  6. CaltrainTimes从设计到发布(基于Flex的手机应用)

    资源下载地址 Caltrain Times 的 iTunes下载地址 Caltrain Times的Android Market 下载地址 Caltrain Times的BlackBerry App ...

  7. Log4j与common-logging联系与区别

    http://blog.csdn.net/courage89/article/details/29649801

  8. SQL Server 手把手教你使用profile进行性能监控

    200 ? "200px" : this.width)!important;} --> 介绍 经常会有人问profile工具该怎么使用?有没有方法获取性能差的sql的问题.自 ...

  9. 关于Coursera上的斯坦福机器学习课程的编程作业提交问题

    学习Coursera上的斯坦福机器学习课程的时候,需要向其服务器提交编程作业,我遇到如下问题: 'Submission failed: unexpected error: urlread: Peer ...

  10. 开源OSS.Social微信项目解析

    ​前言:OSS.Social是个开源的社交网站接口集成项目,当前也有很多其他不错的项目,不过始终没有我想要的那种简单清晰,只能撸起袖子,从头打造一个.当前正在进行的是对微信项目的开发,这里把对接口的整 ...