HTML:选择多个作为下拉列表
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/30190588/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
HTML: Select multiple as dropdown
提问by WeekendCoder
I would like to use a select
field with multiple
as a common dropdown field with size=1
:
我想使用一个select
字段multiple
作为通用下拉字段size=1
:
<select name="test[]" size="1" multiple>
<option>123
<option>456
<option>789
</select>
Why doesn't this code show the arrow for the dropdown?
为什么此代码不显示下拉箭头?
Thanks!
谢谢!
回答by mgroat
A similar question was asked here
If you're able to add an external library to your project, you can try Chosen
如果您能够向项目添加外部库,则可以尝试选择
Here's a sample:
这是一个示例:
$(".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>
One thing I've run into, you have to include JQuery BEFORE you include Chosen or you'll get errors.
我遇到的一件事是,您必须在包含 Chosen 之前包含 JQuery,否则会出错。
回答by Martin Gottweis
It's quite unpractical to make multiple select with size 1. think about it. I made a fiddle here: https://jsfiddle.net/wqd0yd5m/2/
用size 1做multiple select是很不切实际的。想想吧。我在这里做了一个小提琴:https: //jsfiddle.net/wqd0yd5m/2/
<select name="test" multiple>
<option>123</option>
<option>456</option>
<option>789</option>
</select>
Try to explore other options such as using checkboxes to achieve your goal.
尝试探索其他选项,例如使用复选框来实现您的目标。
回答by CannonFodder
Because you're using multiple. Despite it still technically being a dropdown, it doesn't look or act like a standard dropdown. Rather, it populates a list box and lets them select multiple options.
因为你正在使用多个。尽管它在技术上仍然是一个下拉菜单,但它看起来或行为不像标准下拉菜单。相反,它会填充一个列表框并让他们选择多个选项。
Size determines how many options appear before they have to click down or up to see the other options.
大小决定了在必须向下或向上单击以查看其他选项之前出现的选项数量。
I have a feeling what you want to achieve is only going to be possible with a JavaScript plugin.
我有一种感觉,只有使用 JavaScript 插件才能实现您想要实现的目标。
Some examples:
一些例子:
jQuery multiselect drop down menu
http://labs.abeautifulsite.net/archived/jquery-multiSelect/demo/
http://labs.abeautifulsite.net/archived/jquery-multiSelect/demo/
回答by Rahul Tripathi
You probably need to some plugin like Jquery multiselectdropdown. Here is a demo.
您可能需要一些插件,如Jquery 多选下拉菜单。这是一个演示。
Also you need to close your option tags like this:
您还需要像这样关闭选项标签:
<select name="test" multiple>
<option>123</option>
<option>456</option>
<option>789</option>
</select>
回答by Sudhakar Singajogi
<select name="select_box" multiple>
<option>123</option>
<option>456</option>
<option>789</option>
</select>