当sugguest列表很大时，html5 datalist不会下拉

Question

我使用datalist建议选择特定文本输入的数据，但是当数据列表的大小太大时（我还不知道正确的数字，但是当大小大于40时我们非常肯定会发生。）

我使用datalist如下

<datalist id="citysuggest">
    <option value="北京">
    <option value="锦州">
    <option value="唐山">
    <option value="天津">
    <option value="清远">
    <option value="盘锦">
    <option value="成都">
</datalist>
<input type="text" list="citysuggest"  name="name1" value="" />

这里显示当尺寸不是“太大”时，点击向下箭头按钮时，datalist可以下拉。

但是当datalist“太大”时（在本例中实数为42），单击向下箭头按钮时不会下拉建议列表。

对于记录，这发生在Linux Chrome浏览器版本39.0.2171.95

上

有任何修复建议吗？

Answer 1

我认为这是由已知的Cromium bug：

引起的

Answer 2

将您的datalist封闭到div并放入溢出：

<div style="overflow-x: hidden; overflow: scroll; width: 100%; height:500px"> 
       <datalist id="citysuggest">
    <option value="北京">
    <option value="锦州">
    <option value="唐山">
    <option value="天津">
    <option value="清远">
    <option value="盘锦">
    <option value="成都">
</datalist>
<input type="text" list="citysuggest"  name="name1" value="" />
</div>

希望这有帮助！