我试图以某种方式显示选择在点击的悬停intead上的选项。我已经看到一些与此相关的问题，但它们已经很老了，不起作用。
现在有可能在不创建自定义选择的情况下完成这么简单的任务吗？您可以在我的代码中看到我尝试了一些我找到的解决方案，但没有一个能够工作：
const choices = document.getElementsByTagName（“select”）
for（let i = 0; i＆lt; choices.length; i ++）{
选择[i] .onchange = function（）{
if（选择[i] .value）选择[i] .style.color =“green”;
}
选择[i] .onmouseenter = function（）{
console.log（“show select's options”）;
//选择[i] .click（）;
/ *
var事件;
event = document.createEvent（'MouseEvents'）;
event.initMouseEvent（'mousedown'，true，true，window）;
选择[I] .dispatchEvent（事件）;
* /
}
选择[i] .onmouseout = function（）{
// console.log（“隐藏选择选项”）;
if（document.activeElement === choose [i]）{
选择[I] .blur（）;
选择[I] .focus（）;
}
}
}
选项 {
颜色：绿色;
}
选项：first-of-type {
display：none;
}
选择 {
边框：1px纯黑色;
红色;
大纲：0;
}
＆LT;选择＆GT;
＆LT;选项与字母＆LT; /选项＆GT;
＆LT;选项＆gt;一种与LT; /选项＆GT;
＆LT;选项＆GT; b将/选项＆GT;
＆LT;选项＆GT;℃下/选项＆GT;
＆LT;选项＆GT; d＆LT; /选项＆GT;
＆LT;选项＆GT; e控制/选项＆GT;
＆LT; /选择＆GT;
＆LT;选择＆GT;
＆LT;选项＆GT;数字＆LT; /选项＆GT;
＆LT;选项→1＆LT; /选项＆GT;
＆LT;选项→2＆LT; /选项＆GT;
＆LT;选项→3＆LT; /选项＆GT;
＆LT;选项→4＆LT; /选项＆GT;
＆LT;选项→5＆LT; /选项＆GT;
＆LT; /选择＆GT;
＆LT;选择＆GT;
＆LT;选项＆GT;符号和LT; /选项＆GT;
＆LT;选项＆GT;！＆LT; /选项＆GT;
＆LT;选项＆gt;“中＆LT; /选项＆GT;
＆LT;选项＆GT;＃＆LT; /选项＆GT;
＆LT;选项＆GT; $＆LT; /选项＆GT;
＆LT;选项＆GT;％＆LT; /选项＆GT;
＆LT; /选择＆GT;