极客观点
项目管理
HarmonyOS
正如某些人可能已经知道的那样，样式化选择元素是一场噩梦，如果没有一些 javascript 技巧，几乎是不可能的。 HTML5 中的新数据列表可以达到相同的目的，因为用户会看到一个选项列表，并且值记录在输入文本字段中。
这里的限制是列表不会出现，直到用户开始在文本字段中输入内容，即使这样也只会根据他们的输入显示可能的匹配项。我想要的行为是，一旦焦点放在该字段上，整个选项列表就会变得可见。
所以我有这段代码 - 在 jsbin 上查看
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Input - Datalist</title>
</head>
<body>
<input list="categories">
<datalist id="categories">
<option value="Breakfast">Breakfast</option>
<option value="Brunch">Brunch</option>
<option value="Lunch">Lunch</option>
<option value="Dinner">Dinner</option>
<option value="Desserts">Desserts</option>
</datalist>
</body>
</html>
我正试图用这个 Javascript 来显示它：
var catVal = document.getElementsByTagName("input")[0],
cat = document.getElementById("categories");
catVal.style.fontSize = "1.3em";
catVal.addEventListener("focus", function(event){
cat.style.display = "block";
}, false);
任何帮助，将不胜感激，
干杯
原文由 Ady Ngom 发布，翻译遵循 CC BY-SA 4.0 许可协议
我使用以下代码：
鼠标移到：
在全局变量中设置焦点并记住旧值
鼠标按下：
删除值并显示
datalist（内置功能）鼠标：
恢复旧值
然后选择新值。
发现这是针对组合框的可接受的解决方法。