如何检测鼠标是否在jQuery或Javascript中的项目上

How to detect if mouse is over an item in jQuery or Javascript

本文关键字:Javascript jQuery 项目 是否 何检测 检测 鼠标      更新时间:2023-09-26

是否可以检查光标是否在项目上?在我的情况下,我不能使用focus((、mouseenter((或任何相关的方法,但我只需要找出鼠标是否在上面。

在这种特殊情况下,您可以在要隐藏的元素上创建一个透明的覆盖元素,而不是检查鼠标的状态。

因此,当该区域悬停时,它会显示出来,而当它不悬停时,就会隐藏起来显然使用默认值设置要隐藏的元素(直到悬停(显示:无;在您的css中,因此它只在悬停时显示给用户。

我知道这不是OP的要求,但它是有效的。

$(document).ready(function(){
    /* 
    * #object is your element you 
    * want to hide unless hovered
    */
    $("#object").on("mouseleave", function(){
        // divs you want to hide/show
        $('#object').hide();
        $('#overlay').show();
    })
    /* 
    * #overlay is the transparent element 
    * that will sit over the top of #object
    */
    $("#overlay").on("mouseenter", function(){
        // divs you want to hide/show
        $('#object').show();
        $('#overlay').hide();
    })
});

看看它在这里工作http://jsfiddle.net/si_jsfiddle/CvkyE/

这是一个很好的选择,因为mouseenter和mouseleave不受其顶部对象的影响,特别是在on((方法中没有标记对象参数集的情况下,这也是为什么它们非常适合顶部有链接的div容器等

这有用吗?事件目标

小提琴演示

例如:

function handler(ev) {
  var $target = $(ev.target);
  if( $target.is("#element") ) {
   alert('Here am I !');
  }
}
$("#element").hover(handler);

这里有一个轻微的修改以删除元素

演示

function handler(ev) {
  var $target = $(ev.target);
  if( $target.is("#element") ) {
         $target.remove();
  }
}
$("#element").mouseleave(handler);

http://api.jquery.com/mouseover/这是jquery函数。它也有一个很好的例子。

<input etc.... onmouseover="if (condition){calltoafunction();"}>

在Javascript上:如果光标在一个Item上,则If条件有效。