代码之家 › 专栏 › 技术社区 › jcubic

e、当上下文菜单可见时,目标是单击的实体

mouseevent jquery javascript

1

jcubic · 技术社区 · 7 年前

我有这个活动:

$(document).on('click', function(e) {
   var $target = $(e.target);
   if ($target.is('.element')) {
      console.log('element');
   }
});

当我右键单击以显示关联菜单,然后单击 .element (当关联菜单可见时) e.target body .要素 镀铬。

.要素 ?

1 回复 | 直到 7 年前

1

jcubic 7 年前

我通过添加以下代码解决了这个问题:

function inside(element, x, y) {
    var offset = element.offset();
    var width = element.outerWidth();
    var height = element.outerHeight();
    return (x > offset.left && y > offset.top &&
            x < (offset.left + width) && y < (offset.top + height));
}

$(document).on('click', function(e) {
   e = e.originalEvent;
   var inside_elements = $('.element').get().filter(function(element) {
       return inside(element, e.pageX, e.pageY);
   });
   if (inside_elements.length) {
      console.log('element');
   }
});

编辑

$(document).on('click', function(e) {
   e = e.originalEvent;
   var node = document.elementFromPoint(e.pageX, e.pageY);
   var $target = $(node);
   if ($target.is('.element')) {
      console.log('element');
   }
});

奇怪的是,当我尝试在codepen中重新创建这个问题时,这种情况并没有发生,可能是因为单击时文本区域的焦点/模糊。

e、 当上下文菜单可见时,目标是单击的实体

e、当上下文菜单可见时,目标是单击的实体