不要隱藏特定的childNodes的onclick父

我已經得到了未來的HTML代碼：不要隱藏特定的childNodes的onclick父

<div id="main-container"> 
    <article id="doyou">...</article> 
    <article id="theydid">...</article> 
    <article id="nieuws">...</article> 
    ... 
</div>

我想上外篇股利點擊時隱藏物品，而不是在文章本身被點擊。目前，我得到了下面的代碼，但它不工作：

代碼：

$("#main-container").click(function(){ 
     $('article#doyou').not(this).hide(); 
     $('article#theydid').not(this).hide(); 
     $('article#nieuws').not(this).hide(); 
     $('article#stage').not(this).hide(); 
     $('article#info').not(this).hide(); 
     $('article#contact').not(this).hide(); 
     $('article#letop').not(this).hide(); 
    });

來源

2011-05-18 quanto

如果你是隱藏在未被申報單點擊，他們又怎麼可以再次看到？ – 2011-05-18 08:10:55

通過在代碼內添加一個鏈接按鈕：$（'article＃doyou'）。show（）; – quanto 2011-05-18 08:48:10

首先我想給每篇文章一個普通類：

<div id="main-container"> 
    <article id="doyou" class="article">...</article> 
    <article id="theydid" class="article">...</article> 
    <article id="nieuws" class="article">...</article> 
    ... other articles ... 
</div>

然後在jQuery的你可以使用這個類來隱藏所有除了點擊的元素：

$(function() { 
    $(".article").click(function() { 
     hideArticles(); 
     $(this).show(); 
    }); 

    $("#main-container").click(function(e) { 
     if (e.target.id == "main-container") 
      hideArticles(); 
    }); 
}); 

function hideArticles() { 
    $(".article").hide(); 
}

正如我在我的評論中提到，雖然，個不再是顯示所有文章的機制。一旦文章被點擊，所有其他文章將無法恢復。

您可能需要添加一個「顯示的相關文章」按鈕：

$("#show-articles").click(function() { 
    $(".article").show(); 
});

來源

2011-05-18 08:14:14

對不起，我覺得我還不夠清楚：必須單擊DIV＃主容器（文章的父級）來隱藏所有文章。但是如果一篇特定的文章被點擊，文章需要保持可見。 – quanto 2011-05-18 08:42:12

沒問題，我編輯了我的帖子以包含該功能。 – 2011-05-18 08:45:03

嗯仍然不起作用，因爲「主 - 容器 - 隱藏功能」推翻了文章功能。檢查我的測試：http://tinyurl.com/3exv3ro – quanto 2011-05-18 08:58:50

您可以修復這樣

$(document).ready(function() { 
    $("#main-container").click(function(e) { 
     $('article#doyou').not(e.target).hide(); 
     $('article#theydid').not(e.target).hide(); 
     $('article#nieuws').not(e.target).hide(); 
     $('article#stage').not(e.target).hide(); 
     $('article#info').not(e.target).hide(); 
     $('article#contact').not(e.target).hide(); 
     $('article#letop').not(e.target).hide(); 
    }); 
});

演示：http://jsfiddle.net/ynhat/5uuLc/1/

來源

2011-05-18 08:14:59 YNhat

不要隱藏特定的childNodes的onclick父

回答

相關問題