Jquery điều kiện kiểm tra là (': hover') không làm việc

Question

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

Đây là mã của tôi, nó nên cảnh báo 'd' nhưng mỗi lần nó cảnh báo 'f' lỗi Dưới đây

Answer 1

:hover là gì là một CSS pseudo-class , không phải bộ chọn jQuery. Nó không thể được sử dụng một cách đáng tin cậy với is() trên tất cả các trình duyệt.

Answer 2

Như Frederic đã nói, :hover là một phần của CSS và không phải là bộ chọn trong jQuery.

Đối với một giải pháp thay thế, đọc How do I check if the mouse is over an element in jQuery?

cài đặt thời hạn trên mouseout để fadeOut và lưu trữ các giá trị trả về để dữ liệu trong đối tượng. Sau đó onmouseover, hủy bỏ thời gian chờ nếu có giá trị trong dữ liệu.

Xóa dữ liệu trên gọi lại của chế độ fadeout.

Answer 3

tại sao bạn không sử dụng .hover?

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

Answer 4

Hãy thử một cái gì đó giống như this-

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

Answer 5

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

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

Answer 6

Hãy thử một cái gì đó như thế này

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

Vì vậy, bạn có thể tìm hiểu xem chuột là, đối tượng

Answer 7

x.filter(':hover').length 

Điều này cũng có thể sử dụng được khi bạn đã truy vấn một số đối tượng/hoặc bên trong chức năng gọi lại.

Answer 8

Dưới đây là một số ít Plugin jQuery kiểm tra xem con chuột có trên một phần tử hay không.

Cách sử dụng:

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

Ví dụ:

(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>