web-dev-qa-db-ja.com

Jqueryの条件チェックは（ '：hover'）が機能していません

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

これが私のコードです。「d」を警告する必要がありますが、「f」を警告するたびにエラーが発生します。

jqueryif-statementhover
11
Wasim A.
function idIsHovered(id){
    return $("#" + id + ":hover").length > 0;
}

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

33
mathheadinclouds

：hover はCSS pseudo-class であり、jQueryセレクターではありません。すべてのブラウザで is（） と一緒に確実に使用できるわけではありません。

15
Frédéric Hamidi

Fredericが言ったように、 ：hover はCSSの一部であり、jQueryのセレクターではありません。

別の解決策については、 マウスがjQueryの要素の上にあるかどうかを確認するにはどうすればよいですか？ を読んでください。

マウスアウトのタイムアウトをフェードアウトに設定し、戻り値をオブジェクトのデータに格納します。次に、マウスオーバーで、データに値がある場合はタイムアウトをキャンセルします。

フェードアウトのコールバック時にデータを削除します。

6
Connell

このようなものを試してください-

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

なぜ.hoverを使用しないのですか？

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

ここに少し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>
0
Legends
x.filter(':hover').length

これは、すでにいくつかのオブジェクトまたはコールバック関数内でクエリを実行している場合にも使用できる可能性があります。

0
l00k

このようなものを試してください

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

したがって、マウスがオブジェクトであるかどうかを確認できます

0
FRAGnat