Jquery条件检查是(':hover')不起作用

时间:2011-11-04 13:56:34

标签: jquery if-statement hover

$('.xx').mouseenter(function(){
  if($(this).is(':hover'))
    alert('d');
  else
     alert('f');
});

这是我的代码,它应该警告'd',但每次警报'f' 这里有什么错误

8 个答案:

答案 0 :(得分:31)

function idIsHovered(id){
    return $("#" + id + ":hover").length > 0;
}

http://jsfiddle.net/mathheadinclouds/V342R/

答案 1 :(得分:14)

:hover是一个CSS pseudo-class,而不是一个jQuery选择器。它无法在所有浏览器上与is()一起使用。

答案 2 :(得分:6)

正如Frederic所说,:hover是CSS的一部分,并不是jQuery中的选择器。

有关替代解决方案,请阅读How do I check if the mouse is over an element in jQuery?

  

将mouseout上的超时设置为fadeout并将返回值存储到   对象中的数据。然后onmouseover,取消超时,如果有   数据中的值。

     

删除淡出回调的​​数据。

答案 3 :(得分:1)

为什么不使用.hover?

$(".xx").hover(function(){
    alert("d");
});

答案 4 :(得分:1)

尝试这样的事情 -

$('.xx').hover(function(){        
        alert('d');
    }, function() {
       alert('f);
    });

答案 5 :(得分:0)

尝试这样的事情

flag = ($('.xx:hover').length>0);

所以你可以找出鼠标是否是对象

答案 6 :(得分:0)

x.filter(':hover').length

当您已经查询了某些对象/或内部回调函数时,这也可以使用。

答案 7 :(得分:0)

这是一个 jQuery插件,用于检查鼠标是否在元素上。

<强>用法:

$("#YourElement").isMouseOverMe();

示例:

(function($) {

  var mx = 0;
  var my = 0;

  $(document).mousemove(function(e) { // no expensive logic here
    mx = e.clientX; 
    my = e.clientY;
  })

  $.fn.isMouseOverMe = function() {

    var $el = $(this);
    var el_xmin = $el.offset().left;
    var el_ymin = $el.offset().top;
    var el_xmax = el_xmin + $el.width();
    var el_ymax = el_ymin + $el.height();
    return mx >= el_xmin && mx <= el_xmax && my >= el_ymin && my <= el_ymax;
  };

}(jQuery));

$(document).mouseup(function(e) {
  console.log($("#div").isMouseOverMe())
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h2>Click inside or outside of the yellow box</h2>
<div id="div" style="width:200px;height:200px;background-color:yellow;margin-top:50px"></div>