JQuery隱藏元素不工作

我有一個<ul>與大量<li>的它下面。其中每個<li>的內都有一個隱藏的<div class=dbox">。爲<li>的和它們的內容的結構/層次是：JQuery隱藏元素不工作

- >利
---->可見的內容（H3，IMG，P等）
---->隱藏的div .dbox
-------> div.photos
-------> div.specs

當點擊<li>的圖像（總是可見），<div class="dbox">然後給定顯示器=塊。到現在爲止還挺好。然後我搜索了網頁，以便在點擊外部時關閉.dbox。我得到這個工作：

var mouse_is_inside = false; 

    $('.dbox').hover(function(){ 
     mouse_is_inside=true; 
    }, function(){ 
     mouse_is_inside=false; 
    }); 

    $("body").mouseup(function(){ 
     if(! mouse_is_inside) $('.dbox').hide(); 
    });

點擊外部.dbox現在使其關閉。到現在爲止還挺好。下一步是添加了「關閉此窗口按鈕，但高科技，薩維用戶，所以，在<div class="specs">內，我加了最後一個元素，<span class="close">然後遞給了這個jQuery代碼：

$('span.close').click(function() { 

     $(this).parent().parent().hide(); 

    });

，沒有工作。我與父母進行了測試（'。dbox'），但它也沒有工作。有趣的是，它只有當我的目標.dbox隱藏不起作用。如果我這樣做：

$(this).parent().hide();

這將關閉包含分區，<div class="specs">，它的工作原理，有效地關閉<div class="specs">

我則認爲有某種衝突與「外單擊」代碼，以便我把它刪除了，錯誤依然存在......這讓我在這裏問你有關這種困境的知識型研究員。

在此先感謝 G.Campos

來源

2011-07-01 Sotkra

我得到它的工作：$（this）.parents（'。dbox'）。隱藏（1）; 只有當hide（）爲空時纔會發生任何事情。添加1或任何數字的竅門。爲什麼它不是0雖然？ – Sotkra

如果你在http://jsbin.com/或者http://jsfiddle.net/ – Acorn

@Sotkra上舉個例子，它會有所幫助：你能否確認在「li」時顯示「dbox」'div'？點擊_image_而不是點擊'li'本身？ –

我得到它的工作：$(this).parents('.dbox').hide(1); 只有當隱藏（）是空的，沒有什麼會發生。添加1或任何數字的竅門。爲什麼它不是0雖然？

來源

2011-07-04 05:32:55 Sotkra

一種解決方案是，你可以在onMouseLeave事件處理程序中設置mouse_is_inside=false;。

另一種解決方案就是連接你的事件處理程序是這樣的：

$('.dbox').click(function(e) { 
    // do stuff 
    // ... 

    // this will prevent the event from bubbling upto body's eventhandler 
    e.stopPropagation(); 
}); 

$('body').click(function(e) { 
    $('.dbox').hide(); 
});

而且，本應關閉父DBOX格：

$('.dbox span.close').click(function() { 
    $(this).parents('.dbox').hide(); 
});

來源

2011-07-01 19:07:47 Mrchief

您可以mouse_inside使用blur而不是你的絕招。

此外，您可以使用帶有選擇器的parents而不是parent().parent()。

最大

來源

2011-07-01 19:08:20 JMax

嘗試

$(this).parent().parent().parent().hide(); // for button

來源

2011-07-01 19:08:23 thecodeparadox

JQuery隱藏元素不工作

回答

相關問題