📅 最后修改于: 2023-12-03 15:01:13.932000 🧑 作者: Mango
输入搜索模式是HTML5中新增的表单特性之一，它可以让用户在输入框中输入内容时，快速筛选出与输入内容相匹配的选项。通常情况下，这种输入搜索模式会在文本输入框后面出现一个类似搜索图标的小按钮，用户点击该按钮就可以快速筛选出相应的选项。
HTML | DOM 输入搜索模式属性的语法如下所示：
<input type="search">
输入搜索模式有一些可选属性，这些属性可以控制输入框的行为，例如占位符、最小长度、最大长度、默认值等等：
autocomplete：表示输入框是否启用自动补全功能，默认为on；
autofocus：表示页面加载时，输入框是否自动获得焦点，默认为false；
list：表示应用于输入框的预定义选项列表的ID；
minlength：表示输入框的最小长度；
placeholder：表示输入框的占位符文本；
required：表示输入框是否为必填项，如果设置为true，则用户必须在提交表单之前输入内容；
results：表示在用户使用输入框进行查询时，显示的结果数量；
size：表示输入框的大小，以字符数为单位；
spellcheck：表示输入框是否启用拼写检查，默认为true；
value：表示输入框的默认值。
下面是一个简单的示例，该示例演示了如何在HTML中使用输入搜索模式：
<!DOCTYPE html>
<html>
<head>
<title>输入搜索模式示例</title>
</head>
<body>
<form>
<label for="search">搜索:</label>
<input type="search" id="search" name="search">
<input type="submit" value="提交">
</form>
</body>
</html>
在上面的示例中，我们创建了一个包含一个输入搜索框的表单。另外，我们还为表单添加了一个提交按钮。当用户在输入框中输入内容并点击提交按钮时，提交表单将显示匹配的结果。
输入搜索模式属性是HTML5新增的表单特性之一。它可以让用户在输入框中输入内容时快速筛选出与输入内容相匹配的选项。通过控制不同的属性，我们可以自定义输入框的行为。