如何在没有任何第三方库的情况下实现多复选框下拉答案

【问题标题】：how to implement multi checkbox dropdown without any third party libraries如何在没有任何第三方库的情况下实现多复选框下拉
【发布时间】：2018-02-14 08:09:57
【问题描述】：

如何在没有任何第三方库的情况下实现多复选框下拉。

我们想要一个下拉菜单，其中包含不在 jquery 和 javascript 中的复选框。我们想要纯服务器端控制 .

【问题讨论】：

除非您提供迄今为止尝试过的内容并且遇到特定问题，否则该站点并非旨在为您编写代码。在这种情况下，您应该寻找在线课程、教程或聘请专业的编码服务。另见how to ask

标签： drop-down-menu dropdown checkboxlist

【解决方案1】：

纯服务器端控制意味着您将只依赖 HTML 标准。
HTML Select 元素有一个multiple 属性，允许用户选择多个值。
The HTML specification 不需要特定的呈现布局，它可以让浏览器不受任何约束。大多数时候，选择的选项只是简单地高亮显示，加上 multiple 属性使选择元素失去其下拉外观样式（您可以使用size 属性降低其高度）。

<!-- The second value will be selected initially -->
<p>Maintain <kbd>Ctrl</kbd> key down to select multiple elements</p>
<select name="multi" multiple size="2">
  <option value="value1">Value 1</option> 
  <option value="value2" selected>Value 2</option>
  <option value="value3">Value 3</option>
  <option value="value4">Value 4</option>
  <option value="value5">Value 5</option>
  <option value="value6">Value 6</option>
  <option value="value7">Value 7</option>
  <option value="value8">Value 8</option>
  <option value="value9">Value 9</option>
  <option value="value10">Value 10</option>
</select>

如果您改变主意使用 Javascript，您可以实现 this well detailed answer 的建议，因为它只需要很少的额外 Javascript 和 css，但不需要库。

【讨论】：