Question

我正在使用一个带有未定义数量选项的选择框。

示例
我的选择框包含50个具有不同值的选项。我所做的只是显示选项1-10和25-30。其他人是分离的。通过单击选项30，可以附加分离的选项。

我的问题是选择框会像选择后一样关闭。有没有办法抑制这种行为？

如果单击选项30并且分离选项将显示在选项30下而没有选择框关闭，那将是非常好的。

Answer 1

您可以尝试将选择框设置为多选框。然后，当选择显示其他项目的第30项时。

如果您真的喜欢使用常规选择框，那么您可以通过“更多选项...”<option>来生成该操作，当选择时使用javascript加载并重新打开下拉

如果您提供一些示例代码，我可以编写一个示例，也许

Answer 2

我不确定选择下拉列表是否符合您要求的最佳元素。您可能需要考虑使用div中的复选框列表，其overflow属性设置为scroll。这对你来说可能更好。得到一个下拉来做你所问的事情有点牵扯。例如，请参阅this fiddle

示例html

<div id="container">
    <label><input type="checkbox" name="test" value="1" />Option 1</label>
    <label><input type="checkbox" name="test" value="2" />Option 2</label>
    <label><input type="checkbox" name="test" value="3" />Option 3</label>
    <label><input type="checkbox" name="test" value="4" />Option 4</label>
    <label><input type="checkbox" name="test" value="5" />Option 5</label>
    <label><input type="checkbox" name="test" value="6" />Option 6</label>
    <label><input type="checkbox" name="test" value="7" />Option 7</label>
    <label><input type="checkbox" name="test" value="8" />Option 8</label>
    <label><input type="checkbox" name="test" value="9" />Option 9</label>
    <label><input type="checkbox" name="test" value="10" />Option 10</label>
    <label><input type="checkbox" name="test" value="11" />Option 11</label>
    <label><input type="checkbox" name="test" value="12" />Option 12</label>
</div>

CSS

label{display:block;}
#container{height:100px;width:200px;overflow:scroll;}

选择选项后禁止关闭选择框

2 个答案: