jQuery mouseenter适用于鼠标，但不适用于Tab键 [英] jQuery mouseenter works great with mouse but not with tab key

问题描述

$( "#list li:eq(0)" ).bind('mouseenter focus', function(event) {

jQuery("#logo img").css('top', '-132px');
console.log( event.type, " :: ", this.id );
  }).bind('blur mouseleave', function(event) {

jQuery("#logo img").css('top', '-41px');
console.log( event.type, " :: ", this.id );
  });  

这条jQuery在鼠标悬停时效果很好，但没有使用标签键！
你遇到过类似的问题吗？

This piece of jQuery works great with the mouse over but not with the tab key over! Have you encounter a similar problem?

我试过.bind来解雇这两个事件但仍然没有工作！

I have tried .bind to fire both event and still not working!

如果在mouseenter上触发事件但没有任何焦点！

推荐答案

mouseenter 和 mouseleave 与键盘事件无关，当元素获得键盘时不会触发焦点。

mouseenter and mouseleave have nothing to do with keyboard events, and are not fired when an element gains keyboard focus.

让你的代码在 mouseenter 和<$ c $上触发c>焦点，这更接近：

To have your code fire on both mouseenter and focus, this is a bit closer:

$("#MesActivites li:eq(0)").bind("mouseenter focus", function (event) {
    jQuery("#MesActivites ul:eq(1)").css('top', '45px').css('left', '-1px');
    jQuery("#rfr-header-logo").css('display', 'none');
    console.log(event.type, " :: ", this.id);
}).bind("mouseleave blur", function (event) {
    jQuery("#MesActivites ul:eq(1)").css('top', '-1000px').css('left', '-1px');
    jQuery("#rfr-header-logo").css('display', 'block');
    console.log(event.type, " :: ", this.id);
});

这篇关于jQuery mouseenter适用于鼠标，但不适用于Tab键的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！