2

我制作了一个 jQuery / CSS Popup-Style Div。div 的内容通过 ajax-request 加载并放入 .ajax_popup_wrapper ！

当您将鼠标悬停在 TIPP 上时，会创建 div 并将其附加到“BODY”。(.ajax_popup_wrapper_wrapper)

我在 div 函数中使用这些行：

$('.ajax_popup_wrapper_wrapper').mouseout(function(){
        // REMOVE DIV's
});

检查鼠标是否在 .ajax_popup_wrapper_wrapper 上（如果不是 -> 关闭它！）

如果 ajax_popup_wrapper 只包含文本和图像（或类似的东西！），这很好。如果结果包含另一个 div（在图片中：RESULT DIV），那么您不能悬停此 RESULT DIV，因为 .ajax_popup_wrapper_wrapper 已删除。结果 DIV 应位于 wrapper_wrapper 之下，但仍必须可点击！

我试图将 wrapper_wrapper 放在 RESULT DIV 的顶部并且有效（该 div 不会关闭！），但是我无法单击 RESULT DIV 内的链接。

这很奇怪，请帮助我！谢谢！

编辑：我添加了一个 JSFIDDLE 示例 http://jsfiddle.net/dH55F/19/

在此处输入图像描述

4

3 回答 3

0

检测我们将鼠标移入的元素是否具有类[希望您可以在其中的 div 中添加一个标识符]，如果有，则返回 false，否则，只需执行正常的删除代码。

$('.ajax_popup_wrapper_wrapper').mouseout(function(e){
    if($(e.toElement).hasClass('other')){
        return false;   
    }
    //do your remove code here
});

我不确定元素是否已从 DOM 中完全删除，因此以下代码将事件处理程序委托给other单击时 DOM 树中存在的类的任何元素；不管它是否是在 DOM 准备好之后添加的。

$(document).on('mouseout', '.other', function(e){
    e.stopPropagation();
});

注意我们使用，.stopPropagation()我们这样做是为了它不会随意触发.mouseout()..ajax_popup_wrapper_wrapper

理论实现（jsFiddle）

于 2013-03-28T13:19:35.693 回答
0

像这样使用，

var mouse_is_inside = false;
$(document).ready(function()
{
    $('.ajax_popup_wrapper_wrapper').hover(function(){ 
        mouse_is_inside=true; 
    }, function(){ 
        mouse_is_inside=false; 
    });


});

参考：看到这个

于 2013-03-28T13:26:36.740 回答
0

问题解决了！谢谢！

我唯一需要改变的是删除 mouseout() 并将其替换为 mouseleave() ...

$('.ajax_popup_wrapper_wrapper').mouseleave(function(){
// remove div
于 2013-03-28T15:07:29.363 回答