jQuery mouseenter适用于鼠标，但不适用于Tab键

问题描述：

$( "#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 和焦点，这更接近：

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键

相关推荐