Javascript 如何在下拉列表中选择不同的范围值

我有一个下拉列表，它是使用div和span标签创建的。 这就是我当前下拉列表的样子

<div id="userList>
   <div class="selectOption">
         <span class="selectOption Current" value="mike">Mike</span>
         <span class="selectOption" value="andrew">Andrew</span>
         <span class="selectOption" value="emma">Emma</span>
   </div>
<div>

---

这可能比您想要的更多，但下面的示例创建了一个类似于您描述的下拉列表。希望你能从你的项目的例子中得到一些想法

关键思想是使用
keyup（）
捕捉按键。但是，为了防止错误，我们首先测试以确保最后单击的元素是下拉列表（title div或其中一个跨度）

此外，还将ID添加到每个跨距中，以简化对单击跨距的样式设置


您是否尝试过在密钥事件处理程序中使用密钥代码？这就是您需要使用的，然后根据关键代码筛选结果。@charlietfl感谢您的评论。我是新发展的一员。你能给我提供任何关于这个的参考链接吗？所以我可以说，你的问题没有明确说明，你将要实现什么。。。实际上，您甚至没有列表，您有两个容器，其中包含一些
span
元素。。。你应该提供更多细节，比如你的CSS或JS文件，或者阅读更多关于HTML的内容，比如使用列表元素，比如
ul
和
ol
…@Mischback为什么你需要CSS来过滤dom？为什么不能使用span…它们都是一个容器的兄弟姐妹？谢谢。如果有两个用户名以同一个字母开头会发生什么？这不是你问的问题。我建议你为这个问题选择一个正确的答案，然后用这个例子问另一个问题。当你问一个新问题时，很多人都会看到这个问题并试图帮助你，但是当你修改一个现有的问题时，只有一两个人（关注这个问题的人）知道这个新问题。谢谢你的建议。当然
$(document).keyup(function(e){
    if ( activeEl=='ulTitle' || activeEl=='selectOption' ){
        $('.selectOption').removeClass('Current');

        var code = e.keyCode || e.which;
        if (code==77 || code==109) { //m or M
            key='m';
            nam='Mike';
        }else if(code==65 || code==97) { //m or M
            key='a';
            nam='Andrew';
        }else if(code==69 || code==101) { //m or M
            key='e';
            nam='Emma';
        }else if(code==13) { //Enter key
            $('#mybutt').click();
        }
        $('.selectOption#'+key).addClass('Current');
    }
});