Question

我想在选择下拉菜单（多个）中获取复选框，如下所示：

<select name="select_dd" size="5" multiple>
       <option value="1"><input type="checkbox" name="chk_val" value="1" />1</option>
</select>

我认为以上不是有效的，因为复选框出现在选择之外。

所以我尝试了另一种方法：

<div id="selectlist">
    <ul>
        <li><input type="checkbox" name="chk_val" value="1" />1</li>
        <li><input type="checkbox" name="chk_val" value="1" />1</li>
    </ul>
</div>

然后使用css设置div的样式

#selectlist{
border:1px solid;
height:50px;
overflow-y:scroll;
width:auto;
text-align:left;

}
#selectlist ul{
list-style-type: none;
}

这是一个好方法吗？任何人都可以建议是否有其他替代品可供此类使用，如使用jquery插件。

Answer 1

见这个：
http://harvesthq.github.com/chosen/
或者这个：
http://www.erichynds.com/jquery/jquery-ui-multiselect-widget/
或者这个：
http://code.google.com/p/jquery-tree/
或者这个：
http://code.google.com/p/dropdown-check-list/
或者这个用于ASP.NET控件：
http://www.codeproject.com/Articles/24205/MultiSelect-Dropdown-Control

Answer 2

您不能在选项标记中包含输入元素。使用ul / li组合是您所做的正确选择。您必须编写自己的逻辑来表现它，就像选择控件一样，并引发相应的事件。

Answer 3

这种方法没有任何问题（如何将它包裹在div中，就像你的第二个例子）。使用CSS来设置您希望列表中的复选框的样式是完全正常的。

Answer 4

除了列出的复选框列表插件NgM之外，您还可以将select元素设置为多选（multiple=true，我认为），这可能会完成您所追求的同样的事情。

下拉菜单中的复选框

4 个答案: