HTML:选择多个作为下拉列表

Question

我想使用带有 multiple 的 select 字段作为带有 size=1 的普通下拉字段:

<select name="test[]" size="1" multiple>
    <option>123
    <option>456
    <option>789
</select>

为什么这段代码不显示下拉箭头？

谢谢!

Answer 1

A similar question was asked here

如果您能够将外部库添加到您的项目中，您可以尝试 Chosen

这是一个示例:

$(".chosen-select").chosen({
  no_results_text: "Oops, nothing found!"
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.rawgit.com/harvesthq/chosen/gh-pages/chosen.jquery.min.js"></script>
<link href="https://cdn.rawgit.com/harvesthq/chosen/gh-pages/chosen.min.css" rel="stylesheet"/>

<form action="http://httpbin.org/post" method="post">
  <select data-placeholder="Begin typing a name to filter..." multiple class="chosen-select" name="test">
    <option value=""></option>
    <option>American Black Bear</option>
    <option>Asiatic Black Bear</option>
    <option>Brown Bear</option>
    <option>Giant Panda</option>
    <option>Sloth Bear</option>
    <option>Sun Bear</option>
    <option>Polar Bear</option>
    <option>Spectacled Bear</option>
  </select>
  <input type="submit">
</form>

我遇到过一件事，你必须在包含 Chosen 之前包含 JQuery，否则你会出错。