有没有办法显示包含多列选项的HTML下拉列表？
我不希望多列包含一行数据，我想要3行可选选项。
这可以通过.NET或jQuery实现吗？
答案 0 :(得分：2)
使用普通的香草形式字段无法做到这一点。您必须使用javascript或其他任何方式创建自己的表单输入类型。
答案 1 :(得分：1)
HTML select标签不能这样做，但你可以像这样使用html list + javascript + css：
<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=UTF-8" http-equiv="content-type">
<title>Language select widget with multiple columns</title>
<style type="text/css">
div#lang_columns_main {
position: relative;
}
a#lang_columns_selector {
}
div#lang_columns_dialog {
background-color: white;
border: 1px solid black;
display: none;
position: absolute;
}
ul.lang_columns_column {
float: left;
margin: 0;
overflow: hidden;
padding: 0;
}
ul.lang_columns_column li {
list-style: none;
padding: 1px;
}
ul.lang_columns_column li a {
}
</style>
<script language="javascript" type="text/javascript">
function lang_columns_toggle() {
var dialog = document.getElementById("lang_columns_dialog");
if(dialog.style.display == "block") {
dialog.style.display = "none";
} else {
dialog.style.display = "block";
}
}
</script>
</head>
<body>
<div id="lang_columns_main">
<a href="javascript:lang_columns_toggle();" id="lang_columns_selector">English</a>
<div id="lang_columns_dialog">
<ul class="lang_columns_column">
<li><a href="#">Afrikaans</a></li>
<li><a href="#">Amharic</a></li>
<li><a href="#">Arabic</a></li>
<li><a href="#">Armenian</a></li>
<li><a href="#">Azerbaijani</a></li>
<li><a href="#">Basque</a></li>
<li><a href="#">Belarusian</a></li>
<li><a href="#">Bengali</a></li>
<li><a href="#">Bulgarian</a></li>
<li><a href="#">Catalan</a></li>
<li><a href="#">Chichewa</a></li>
<li><a href="#">Coptic</a></li>
<li><a href="#">Croatian</a></li>
<li><a href="#">Czech</a></li>
<li><a href="#">Danish</a></li>
<li><a href="#">Dutch</a></li>
<li><a href="#">English</a></li>
<li><a href="#">Esperanto</a></li>
<li><a href="#">Estonian</a></li>
<li><a href="#">Faroese</a></li>
<li><a href="#">Persian</a></li>
<li><a href="#">Fijian</a></li>
<li><a href="#">Finnish</a></li>
<li><a href="#">French</a></li>
<li><a href="#">Frisian</a></li>
</ul>
<ul class="lang_columns_column">
<li><a href="#">Friulian</a></li>
<li><a href="#">Galician</a></li>
<li><a href="#">Gascon</a></li>
<li><a href="#">German</a></li>
<li><a href="#">Greek</a></li>
<li><a href="#">Gujarati</a></li>
<li><a href="#">Hawaiian</a></li>
<li><a href="#">Hebrew</a></li>
<li><a href="#">Hindi</a></li>
<li><a href="#">Hungarian</a></li>
<li><a href="#">Icelandic</a></li>
<li><a href="#">Indonesian</a></li>
<li><a href="#">Interlingua</a></li>
<li><a href="#">Irish</a></li>
<li><a href="#">Italian</a></li>
<li><a href="#">Kashubian</a></li>
<li><a href="#">Khmer</a></li>
<li><a href="#">Kinyarwanda</a></li>
<li><a href="#">Kiswahili</a></li>
<li><a href="#">Korean</a></li>
<li><a href="#">Kurdish</a></li>
<li><a href="#">Latin</a></li>
<li><a href="#">Latvian</a></li>
<li><a href="#">Lingala</a></li>
<li><a href="#">Lithuanian</a></li>
</ul>
<ul class="lang_columns_column">
<li><a href="#">Luxembourgish</a></li>
<li><a href="#">Malagasy</a></li>
<li><a href="#">Malay</a></li>
<li><a href="#">Māori</a></li>
<li><a href="#">Macedonian</a></li>
<li><a href="#">Marathi</a></li>
<li><a href="#">Malayalam</a></li>
<li><a href="#">Mongolian</a></li>
<li><a href="#">Ndebele</a></li>
<li><a href="#">Nepali</a></li>
<li><a href="#">Northern Sotho</a></li>
<li><a href="#">Norwegian</a></li>
<li><a href="#">Occitan</a></li>
<li><a href="#">Oriya</a></li>
<li><a href="#">Papiamentu</a></li>
<li><a href="#">Persian</a></li>
<li><a href="#">Polish</a></li>
<li><a href="#">Portuguese</a></li>
<li><a href="#">Punjabi</a></li>
<li><a href="#">Quechua</a></li>
<li><a href="#">Quichua</a></li>
<li><a href="#">Romanian</a></li>
<li><a href="#">Русский</a></li>
<li><a href="#">Sami</a></li>
<li><a href="#">Scottish Gaelic</a></li>
</ul>
<ul class="lang_columns_column">
<li><a href="#">Serbian</a></li>
<li><a href="#">Setswana</a></li>
<li><a href="#">Sinhala</a></li>
<li><a href="#">Slovak</a></li>
<li><a href="#">Slovenian</a></li>
<li><a href="#">Southern Sotho</a></li>
<li><a href="#">Spanish</a></li>
<li><a href="#">Swazi/Swati</a></li>
<li><a href="#">Swedish</a></li>
<li><a href="#">Tagalog</a></li>
<li><a href="#">Tamil</a></li>
<li><a href="#">Tetum</a></li>
<li><a href="#">Thai</a></li>
<li><a href="#">Tsonga</a></li>
<li><a href="#">Ukrainian</a></li>
<li><a href="#">Urdu</a></li>
<li><a href="#">Uzbek</a></li>
<li><a href="#">Venda</a></li>
<li><a href="#">Vietnamese</a></li>
<li><a href="#">Wayunaiki</a></li>
<li><a href="#">Welsh</a></li>
<li><a href="#">Xhosa</a></li>
<li><a href="#">Yiddish</a></li>
<li><a href="#">Zulu</a></li>
</ul>
</div>
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi a eleifend est. Sed eleifend, nulla a commodo lobortis, neque erat tincidunt neque, in ultrices mauris purus ac orci. Donec venenatis augue non nisi ornare malesuada. Praesent convallis nibh eget diam luctus a varius libero sagittis. Etiam eros lectus, tristique ultrices commodo id, pulvinar in leo. Praesent non mauris accumsan ligula convallis imperdiet a eu tellus. In tincidunt molestie tempor. Duis consectetur hendrerit orci, sed facilisis ante tempus vitae. Nulla neque metus, auctor vel tempus eu, congue eu nisl. Nam convallis pulvinar pulvinar. Integer pulvinar ligula porta erat dignissim pharetra. Fusce vestibulum sollicitudin velit convallis tincidunt. Donec imperdiet vulputate mauris, in egestas sapien tincidunt nec. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Duis viverra urna vitae leo gravida condimentum. Phasellus aliquam neque sed ligula dapibus venenatis.</p>
</body>
</html>
答案 2 :(得分：0)
就你的问题而言，这是不可能的，首先要有一个选择元素的目的！只需使用复选框或单选按钮。
答案 3 :(得分：0)
我不知道用HTML做一个方法，但你可以在.NET中创建一个自定义控件来处理这个问题，可能是通过在.NET中扩展选择列表类并根据需要进行渲染。