input的样式简介

标签：

<input

type="text"

autocomplete="off"

placeholder=""

x-webkit-speech=""

id="name" name="name"

value="" maxlength="10"

>

input 大部分样式

type：

autocomplete：

关于form/input 的autocomplete="off"属性

一、

有过表单设计经验的朋友肯定知道，当我们在浏览器中输入表单信息的时候，往往input文本输入框会记录下之前提交表单的信息，以后每次只要双击 input文本输入框就会出现之前输入的文本，这样有时会觉得比较方便，但有时也会暴露用户的隐藏数据，所以今天就教大家让input表单输入框不记录输 入过信息的方法。

    其实方法很简单，只需要在input文本输入框中加一条属性即可，相关代友如下所示：

如果是ASP.NET服务器控件,比如TextBox，可以在后台代码加上：

this.txbAddress.Attributes.Add("autocomplete",off);

二、

input 的属性autocomplete 默认为on

其含义代表是否让浏览器自动记录之前输入的值

很多时候，需要对客户的资料进行保密，防止浏览器软件或者恶意插件获取到

可以在input中加入 来关闭记录

另外，如果整个表单都不想让浏览器自动记录之前输入的值，我们可以给from表单加上，这样整个表单都不会记录用户输入的值。

If the page containing the password field is served over HTTPS and it was served with headers preventing caching 
of the data in the form, then Autocomplete is turned off for the form in Internet Explorer.

如果页面使用HTTPS协议并且包含密码字段，它是在请求头部阻止缓存表单中的数据，然后关闭IE中的自动补全。（呵呵，按自己的理解翻译的，未必准确）

系统需要保密的情况下可以使用此参数

placeholder：

placeholder顾名思义是一个占位符。
在你的value为空的时候他才会显示出来，但是他本身并不是value，也不会被表单提交。

注：其实明白点就是你想给在框里的字，但是你想打字到边框它就消失了

x-webkit-speech 输入框中的“小话筒”：

使用语音输入作用有：
1.提供除了键盘和鼠标的另一个输入方法，针对pc用户，当键盘不可用时也可以使用语音输入。
2.为手机用户提供更加方便的输入方法。

lang

这玩意可以强制输入框里面的语音的语言种类，例如
<input type="text" x-webkit-speech lang="zh-CN"/>

1.支持的浏览器

x-webkit-speech是webkit内核浏览器的私有属性(废话)。但现在只能在google的chrome 11以上才能使用。
实现过程大概是捕捉到语音后，数据发送到google的服务器进行语音识别，然后返回结果。所以没有足够强大大的研发能力和服务器资源，真没法支持这个服务。
作为普通话不标准经常被别人吐槽的人，使用语音搜索还是能十分准确地返回关键词，我顿时感动得一塌糊涂。

2.支持的标签

输入标签有input和textarea，实际上目前只有input支持。

3.检测浏览器是否支持

1if (document.createElement("input").webkitSpeech === undefined) { 

2    alert("Speech input is not supported in your browser."); 

3} 

4.直接使用

为input标签加上x-webkit-speech属性

1<input type="search" x-webkit-speech />

捕捉到语音输入后会直接将关键词填入到输入框里。

5.监听输入

若要监听输入变化以便做其他处理，使用onwebkitspeechchange属性添加处理函数。

1<input type="search" x-webkit-speech onwebkitspeechchange="onChange()"/>

1<script type="text/javascript">

2    function onChange() {

3        alert(‘changed‘);

4    }

5</script>

6.注意：

如果原input中value不为空，输入会直接添加在原有文字后面。既然用webkit就要用placeholder了，不要再使用value为作输入提示了。

转自：http://hi.baidu.com/etion/item/395750dc3a6c72e7b3f7778e

id and name：

input的样式简介

标签：

原文地址：http://www.cnblogs.com/qiuzhimutou/p/4709655.html