HTML |

HTML中的<input>标签是用于创建各种表单元素的通用容器。其中type属性可以指定输入域的类型。type="search"表示输入域是一个搜索框。

基本语法

<input type="search" name="search" placeholder="Search...">

其中：

• type="search"：指定输入域类型为搜索框。
• name="search"：指定搜索框的名称，是表单数据的标识符。
• placeholder="Search..."：指定搜索框的提示文字。

效果演示

属性说明

我们还可以对搜索框进行进一步的设置，详细的属性说明如下：

| 属性 | 描述 | | --- | --- | | autocomplete | 规定是否启用自动完成功能。 | | autofocus | 规定在页面加载时是否自动聚焦。 | | disabled | 规定输入框是否被禁用。 | | form | 规定输入框所属的表单。 | | list | 规定与输入框关联的datalist元素的id。 | | max | 规定输入框可输入的最大值。 | | maxlength | 规定输入框可输入的最大长度。 | | min | 规定输入框可输入的最小值。 | | name | 规定输入框的名称。 | | pattern | 规定输入框的值必须匹配指定的正则表达式。 | | placeholder | 规定输入框的提示文本。 | | readonly | 规定输入框是否只读。 | | required | 规定输入框是否必填。 | | size | 规定输入框的尺寸。 | | spellcheck | 规定输入框是否启用拼写检查。 | | step | 规定输入框的合法数字间隔。 | | tabindex | 规定输入框的tab键顺序。 | | type | 规定输入框的类型。 | | value | 规定输入框的初始值。 |

浏览器兼容性

search 类型在 IE 10 以下的浏览器不支持，但是我们可以使用一些 polyfill库 来实现该功能，例如：Modernizr 。