文档章节

触摸手机上 input 中的学问

pauli
 pauli
发布于 2014/05/29 14:30
字数 528
阅读 1160
收藏 7

在触摸手机上,可以有虚拟键盘,自动识别不同的输入框类型。

如果设置恰当的 type 属性,极大的方便了用户的输入。

常见类型(HTML5):http://www.w3school.com.cn/html5/att_input_type.asp

描述
button 定义可点击的按钮(大多与 JavaScript 使用来启动脚本)
checkbox 定义复选框。
color 定义拾色器。
date 定义日期字段(带有 calendar 控件)
datetime 定义日期字段(带有 calendar 和 time 控件)
datetime-local 定义日期字段(带有 calendar 和 time 控件)
month 定义日期字段的月(带有 calendar 控件)
week 定义日期字段的周(带有 calendar 控件)
time 定义日期字段的时、分、秒(带有 time 控件)
email 定义用于 e-mail 地址的文本字段
file 定义输入字段和 "浏览..." 按钮,供文件上传
hidden 定义隐藏输入字段
image 定义图像作为提交按钮
number 定义带有 spinner 控件的数字字段
password 定义密码字段。字段中的字符会被遮蔽。
radio 定义单选按钮。
range 定义带有 slider 控件的数字字段。
reset 定义重置按钮。重置按钮会将所有表单字段重置为初始值。
search 定义用于搜索的文本字段。
submit 定义提交按钮。提交按钮向服务器发送数据。
tel 定义用于电话号码的文本字段。
text 默认。定义单行输入字段,用户可在其中输入文本。默认是 20 个字符。
url 定义用于 URL 的文本字段。

当然了,输入法也要具备这种智能检测能力,下面是谷歌拼音输入法截屏(百度输入法不行),Android 4.4 系统下。

type 为空,type="text"

type="tel"

type="url"(原来是中文状态,自动切换到英文状态,键盘上多出了斜线“/”)


type="search"


type="time" (datetime, datetime-local, month, week 类似


type="color"



手机测试请输入上面网址(http://itstar.net/article/input.htm)或者扫描下面二维码:

© 著作权归作者所有

共有 人打赏支持
上一篇: 代码优化
下一篇: NodeBB 环境搭建
pauli

pauli

粉丝 25
博文 8
码字总数 2855
作品 0
上海
前端工程师
私信 提问
加载中

评论(4)

五杀联盟
五杀联盟
uc下面正常
五杀联盟
五杀联盟
我用的也是谷歌输入法
五杀联盟
五杀联盟
真的不行
五杀联盟
五杀联盟
不行的
[嵌入式开发板学习分享]迅为i.MX6开发板QT 鼠标和触摸的问题

本文转自迅为论坛:http://www.topeetboard.com 平台:迅为-i.MX6开发板 一. 背景 在使用迅为提供的QT4.7的时候,鼠标可以正常使用,有触摸但是触摸会出现问题。尤其是在左右滑动qt界面的时候...

歌之王子殿下
2017/04/13
43
0
Android游戏开发之单点触摸与多点触摸的响应方式(二十三)

Android游戏开发之单点触摸与多点触摸的响应方式 雨松MOMO原创文章如转载,请注明:转载自雨松MOMO的博客原文地址:http://blog.csdn.net/xys289187120/article/details/6686708 游戏开发中的...

彭博
2012/03/09
193
0
Android游戏开发之单点触摸与多点触摸的响应方式(二十三)

Android游戏开发之单点触摸与多点触摸的响应方式 雨松MOMO原创文章如转载,请注明:转载自雨松MOMO的博客原文地址:http://blog.csdn.net/xys289187120/article/details/6686708 游戏开发中的...

晨曦之光
2012/03/07
243
0
苹果对Nexus One发出多点触摸专利官司威胁

据Windows Weekly网站报道,传苹果公司曾试图劝说谷歌和HTC公司不要在Nexus One手机中采用多点触摸设计。据这家媒体从谷歌内部得到的消息显示,苹果曾经“礼貌”地请求谷歌不要在美国版的Nex...

老枪
2010/01/19
553
2
十分钟了解Android触摸事件原理(InputManagerService)

从手指接触屏幕到MotionEvent被传送到Activity或者View,中间究竟经历了什么?Android中触摸事件到底是怎么来的呢?源头是哪呢?本文就直观的描述一个整个流程,不求甚解,只求了解。 Androi...

看书的小蜗牛
2017/12/07
0
0

没有更多内容

加载失败,请刷新页面

加载更多

Vue重要知识小结

vue sync修饰 (1)双向数据绑定,父子组件之间信息的交互 1⃣️在自组件中使用this.emmit('toFather'),子组件产生一个tofather事件,然后在父组件中通过@进行监听,那么可以实现通信过程 2⃣...

peakedness丶
35分钟前
1
0
1024我们的码农节-向自己致敬!

一、blog主有话要说 作为(真正)入赘程序届的第一年, 对明天的1024码农节有很多话想说.比如: 给各位辛苦大佬们讲几个咱们程序届段子 给自己立一个flag, 明年的1024争取少掉点甚至不掉头发! ...

Ala6
37分钟前
10
0
solr使用规范

0. 目的 规范solr设计、用法,避免bug,提高性能 1. 设计规范 solr的用途是查询,不是存储,建议查询结果尽量都为id主键,而后再拿该id主键到缓存或者db中再查询相关信息,例如:请勿将经销商...

andersChow
49分钟前
1
0
11-《深度拆解JVM》之Java对象的内存布局

一、问题引入 在 Java 程序中,我们拥有多种新建对象的方式。除了最为常见的 new 语句之外,我们还可以通过反射机制、Object.clone 方法、反序列化以及 Unsafe.allocateInstance 方法来新建对...

飞鱼说编程
53分钟前
1
0
Windows Install Docker

win7、win8 win7、win8 等需要利用 docker toolbox 来安装,国内可以使用阿里云的镜像来下载,下载地址:http://mirrors.aliyun.com/docker-toolbox/windows/docker-toolbox/ docker toolbox...

linuxprobe16
58分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部