输入数据表不在动态添加的元素中工作

Question

假设我有数据列表的列表输入，如下所示：

<input type="text" name="color" id="color" value="" list="colorlist" />
<datalist id="colorlist">
    <select style="display: none;">
        <option value="Black" />
        <option value="Blue" />
        <option value="Dark Green" />
        <option value="Grey" />
        <option value="Green" />
        <option value="Red" />
        <option value="White" />
        <option value="Yellow" />
    </select>
</datalist>

如果像这样的列表被加载为我通过AJAX获得的更大的HTML结构的一部分，那么这个数据列表不起作用。 没有显示自动完成列表。 在任何其他情况下，如果这是作为默认视图加载（所以没有任何AJAX请求）一切正常。 我100％确定每个属性都有正确的名称。

我错过了什么？

Answer 1

datalist元素不正确。 删除“选择”。 在您在评论中提供的jsfiddle中，您没有选择。

所以它应该像这样工作：

<input type="text" name="color" id="color" value="" list="colorlist" /> <datalist id="colorlist"> <option value="Black" /> <option value="Blue" /> <option value="Dark Green" /> <option value="Grey" /> <option value="Green" /> <option value="Red" /> <option value="White" /> <option value="Yellow" /> </datalist>