方法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. Beautiful Soup 定位指南

    Reference: http://blog.csdn.net/abclixu123/article/details/38502993 网页中有用的信息通常存在于网页中的文本或各种不同标签的属性值,为 ...

  2. css3实战版的点击列表项产生水波纹动画

    1.html+js: <!DOCTYPE html><html><head lang="en">    <meta charset=&qu ...

  3. 3. 托管对象模型的迁移(Core Data 应用程序实践指南)

    本章介绍如何添加模型版本及模型映射,演示几种迁移技术,供在升级模型时使用. 3.1. 修改托管对象模型 3.2. 添加模型版本 3.3. 轻量级迁移方式 3.4. 默认的迁移方式 3.5. 通过迁移管 ...

  4. return_url和notify_url的区别

    页面跳转同步通知页面特性(return_url特性) (1)   买家在支付成功后会看到一个支付宝提示交易成功的页面,该页面会停留几秒,然后会自动跳转回商户指定的同步通知页面(参数return_url ...

  5. C# winform DatagridView 的简单操作

    数据显示操作: dgBill.Columns[0].DataPropertyName = "key1"; dgBill.Columns[1].DataPropertyName = ...

  6. Last-Modified和ETag以及Apache和Nginx中的配置

    1) 什么是”Last-Modified”? 在浏览器第一次请求某一个URL时,服务器端的返回状态会是200,内容是你请求的资源,同时有一个Last-Modified的属性标记此文件在服务期端最后被修 ...

  7. 对lua中_ENV表的理解(lua5.2版本以后)

    当我拿到_ENV表的时候,会去想这个_ENV表是干什么用的? 首先看如下代码: print(_ENV) --0x1d005f0 print(_G) --0x1d005f0 ViewCode 看了上面的 ...

  8. python中关于局部变量与全局变量的认识

    1.函数内部的变量名如果第一次出现,且出现在=前面,即被视为定义一个局部变量,不管全局域中有没有用到该变量名,函数中使用的将是局部变量,例如: num = 100 def func(): num = ...

  9. wince开发环境搭建与全套教程

    http://www.cnblogs.com/zhchongyao/archive/2010/12/28/1919176.html http://blog.csdn.net/weiren2006/ar ...

  10. Form开发:字段关系-消息-快速编码-参数和系统变量

     1.字段关系  清除依赖字段:在挂LOV的名称字段的WHEN-VALIDATE-ITEM调用:app_field.clear_dependent_fields    设置字段依赖:在主字段的WHEN ...