如何使用JQuery选择当前正在悬停的项目？

Question

我正在使用jQuery 1.12。我有以下类，适用于鼠标悬停在它们上面的项目

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

我想用jQuery来选择当前有悬停的项目（上面的类），所以我试过

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

但这不起作用，至少，它不在我的小提琴中 - http://jsfiddle.net/cwzjL2uw/11/。打开其中一个选择下拉列表，将鼠标悬停在其中一个项目上，然后按键盘上的任意键激活我的选择器。选择器重复返回“未定义”。

Answer 1

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是否实际上也有匹配或将会遇到错误

Answer 2

取决于您想要的数据，但您记录错误的内容。

将console.log更改为：

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

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