如果输入字段为空，则隐藏数据列表选项

Question

我在这里设置了一个简单的数据列表。我想防止在输入内容之前单击输入字段以查看选项列表。我只希望在输入内容后显示一些可能的匹配项时显示该列表。

<input type="text" list="optionlist" autocomplete="off">
<datalist id="optionlist">
    <select>
            <option>Option 1</option>
            <option>Option 2</option>
            <option>Option 3</option>
            <option>Option 4</option>
            <option>Option 5</option>
    </select>
</datalist>

Answer 1

如果您使用的是jQuery（或任何元素选择遮罩工具）：

$("select").click(function (e) {
    if ($("[list=optionList]").val() == "") {
        e.preventDefault();
    }
});