如何使用 JQuery 到 select 当前悬停的项目？

Question

我正在使用 jQuery 1.12。我有以下 class，适用于鼠标悬停在其上的项目

.select-options li:hover {
  color: gray;
  background: #fff;
}

我想用jQuery到select当前悬停的项目（上面的class），所以我试了

elt = $('.select-options li:hover')

但这不起作用，至少，它不在我的 Fiddle — http://jsfiddle.net/cwzjL2uw/11/ 中。打开 Select 下拉列表之一，将鼠标悬停在其中一项上，然后按键盘上的任意键以激活我的 selector。 select或重复returns“未定义”。

Answer 1

取决于你想要什么数据，但你记录的是错误的东西。

将您的 console.log 更改为：

console.log(elt[0].innerHTML);

您将获得悬停的任何文本数据。

Answer 2

一个 jQuery 对象没有 outerHTML 属性...底层 dom 元素有

尝试改变

$(window).keydown(function(event){
    elt = $('.select-options li:hover')
    console.log(elt.outerHTML); 
});

到

$(window).keydown(function(event){
    elt = $('.select-options li:hover')
    console.log(elt[0].outerHTML);    
});

您将需要添加额外的检查以查看 elt 是否确实也有匹配项或运行是否会出现错误

How do I use JQuery to select an item that is currently being hovered over?