此页面由社区从英文翻译而来。了解更多并加入 MDN Web Docs 社区。
HTML 属性：multiple
如果设置了布尔属性multiple，则意味着表单控件将接受一个及以上的值。该属性对email 和file 输入类型以及<select> 元素有效。用户选择多个值的方式取决于表单控件。
尝试一下
<label for="recipients">Where should we send the receipt?</label><input name="recipients" type="email" multiple /><label for="shakes">Which shakes would you like to order?</label><select name="shakes" multiple> <option>Vanilla Shake</option> <option>Strawberry Shake</option> <option>Chocolate Shake</option></select><label for="payment">How would you like to pay?</label><select name="payment"> <option>Credit card</option> <option>Bank Transfer</option></select>label { display: block; margin-top: 1em;}input,select { width: 100%;}input:invalid { background-color: lightpink;}概述
根据类型的不同，如果设置了multiple 属性，表单控件可能会有不同的外观。对于文件输入类型，浏览器提供的本地信息也不同。在 Firefox 中，当属性存在时，文件输入会显示“未选择文件”，而当属性不存在时，则会显示“未选择文件”。大多数浏览器都会在设置了multiple 属性的情况下为<select> 控件显示滚动列表框，而在省略该属性时则显示单行下拉菜单。无论是否包含multiple 属性，email 输入的显示效果都是一样的，但如果不包含该属性，则在包含一个以上逗号分隔的电子邮件地址时会匹配:invalid 伪类。
当email 输入类型设置了multiple 时，用户可以输入零个（如果没有设置required 属性）、一个或多个逗号分隔的电子邮件地址。
<input type="email" multiple name="emails" />当且仅当指定了multiple 属性时，该值可以是一串格式正确的逗号分隔电子邮件地址。列表中每个地址的前导和后随空白字符都会被删除。
当file 输入类型设置了multiple 属性时，用户可选择一个或多个文件。用户可以在所选平台允许的任何方式下，从文件选择器中选择多个文件（如按下Shift 或Control 键，然后单击一个文件）。
<input type="file" multiple name="uploads" />如果省略了该属性，在每个<input> 上用户只能选择一个文件。
<select> 元素上的multiple 属性表示从选项列表中选择零个或多个选项的控件。若不存在该属性，<select> 元素表示从选项列表中选择一个<option> 的控件。
<select multiple name="dwarfs"> <option>Grumpy</option> <option>Happy</option> <option>Sleepy</option> <option>Bashful</option> <option>Sneezy</option> <option>Dopey</option> <option>Doc</option></select>当指定了multiple 时，大多数浏览器会显示一个滚动的列表框，而不是单行下拉菜单。
无障碍考虑
提供说明，帮助用户了解如何填写表格和使用各个表格控件。说明任何必填和选填内容、数据格式以及其他相关信息。使用multiple 属性时，应告知用户允许使用多个值，并提供如何提供多个值的说明，例如“用逗号分隔电子邮件地址”。
在多选区上设置size="1" 可以使其在某些浏览器中显示为单选框，但这样它就不会在聚焦时展开，从而损害了可用性。不要这样做。如果确实改变了选择项的外观（甚至根本没有这样做时），也要确保告知用户可以通过另一种方法选择多个选项。
示例
email 输入
<label for="emails">想要将邮件发送给谁？</label><input type="email" multiple name="emails" list="dwarf-emails" required size="64" /><datalist> <option value="grumpy@woodworkers.com">Grumpy</option> <option value="happy@woodworkers.com">Happy</option> <option value="sleepy@woodworkers.com">Sleepy</option> <option value="bashful@woodworkers.com">Bashful</option> <option value="sneezy@woodworkers.com">Sneezy</option> <option value="dopey@woodworkers.com">Dopey</option> <option value="doc@woodworkers.com">Doc</option></datalist>input:invalid { border: red solid 3px;}当且仅当指定了multiple 属性时，值可以是以逗号分隔的邮件地址列表，其中每个地址的前导和后随空白字符都会被删除。如果required 属性存在，至少需要一个邮件地址。
当multiple 属性存在时，某些浏览器支持为后续电子邮件地址显示相关的<datalist> 中选项的list，而其他浏览器不支持。
file 输入
如果在file 输入类型上设置了multiple，用户就可以选择一个或多个文件：
<form method="post" enctype="multipart/form-data"> <p> <label for="uploads">选择要上传的图像：</label ><input type="file" name="uploads" accept=".jpg, .jpeg, .png, .svg, .gif" multiple /> </p> <p> <label for="text">选择要上传的文本文件：</label ><input type="file" name="text" accept=".txt" /> </p> <p> <input type="submit" value="提交" /> </p></form>请注意设置了multiple 的示例与未设置file 的其他输入在外观上的区别。
提交表单时，如果我们使用method="get"，每个选定文件的名称都会以?uploads=img1.jpg&uploads=img2.svg 的形式添加到 URL 参数中。但是，由于我们提交的是多部分表单数据，因此必须使用 post。更多信息请参阅<form> 元素和发送表单数据。
select 元素
<select>元素上的multiple 属性表示从选项列表中选择零个或多个选项的控件。若无该属性，<select> 元素表示从选项列表中选择一个<option> 的控件。控件的外观通常会根据multiple 属性的存在而有所不同，当存在该属性时，大多数浏览器显示的是滚动列表框，而不是单行下拉菜单。
<form method="get" action="#"> <p> <label for="dwarfs">选择你喜欢的小矮人樵夫：</label ><select multiple name="dwarfs"> <option>grumpy@woodworkers.com</option> <option>happy@woodworkers.com</option> <option>sleepy@woodworkers.com</option> <option>bashful@woodworkers.com</option> <option>sneezy@woodworkers.com</option> <option>dopey@woodworkers.com</option> <option>doc@woodworkers.com</option> </select> </p> <p> <label for="favoriteOnly">选择你最喜欢的小矮人：</label ><select name="favoriteOnly"> <option>grumpy@woodworkers.com</option> <option>happy@woodworkers.com</option> <option>sleepy@woodworkers.com</option> <option>bashful@woodworkers.com</option> <option>sneezy@woodworkers.com</option> <option>dopey@woodworkers.com</option> <option>doc@woodworkers.com</option> </select> </p> <p> <input type="submit" value="提交" /> </p></form>注意两个表单控件的外观区别。
/* 取消注释该 CSS，使带 multiple 属性的高度与单选高度相同 *//*select[multiple] { height: 1.5em; vertical-align: top;}select[multiple]:focus,select[multiple]:active { height: auto;}*/有几种方法可以在带有multiple 属性的<select> 元素中选择多个选项。根据操作系统不同，鼠标用户可以在按下Ctrl、Command 或Shift 的同时单击多个选项以选择/取消选择它们。键盘用户可通过聚焦<select> 元素来选择连续多个项目，使用Up 或Down 键选择所选范围的顶部或底部，并用光标键在选项间上下移动。非连续项选择支持尚不完善：项目应能通过按Space 键来选择和取消选择，但不同浏览器的支持情况各不相同。
规范
| Specification |
|---|
| HTML # attr-input-multiple |
| HTML # attr-select-multiple |