顯示隱藏的元素

我有三個div元素。當你點擊它們時，它們將被隱藏起來。還有一個按鈕，它應該顯示隱藏的元素。顯示隱藏的元素

這裏是我的代碼：

$("div").click(function(e) { 
 
    $(this).hide(); 
 
}); 
 

 
$("body").on('click', '.close_cmnt_edit', function(e) { 
 
    /* how to show that element which is hide? */ 
 
});

div{ 
 
border:1px solid gray; 
 
padding 15px; 
 
margin: 5px; 
 
text-align: center; 
 
cursor:pointer;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
 
<div class="test1">anything1</div> 
 
<div class="test2">anything2</div> 
 
<div class="test3">anything3</div> 
 

 
<br><br> 
 
<button>show that element which is hide </button>

注：如果有一個以上的隱藏元素，它必須根據他們的藏身爲了顯示。例如：首先div.test2被隱藏，然後div.test1被隱藏。所以，當我點擊那個按鈕時，首先要顯示div.test2然後div.test1。

來源

2015-12-06 Shafizadeh

如果您需要訂購這樣的，你需要的東西來跟蹤元素，例如一列保持的元素，你可以彈出它們趕走，因爲他們會再次顯示。 – adeneo

@adeneo究竟是什麼意思''數組''？一個類似localStorage的JavaScript數組？ – Shafizadeh

除非你需要跟蹤頁面加載，一個普通的數組應該沒事 – adeneo

如果只有一個隱藏的元素，或顯示所有隱藏要素，你可以這樣做：

$("body").on('click', '.close_cmnt_edit', function(e) { 
    $("div:hidden").show(); 
});

用於顯示元素的順序，你可以使用數組數據作爲棧。

// Create a track of all the elements. 
 
hiddenElements = []; 
 

 
$("div").click(function(e) { 
 
    hiddenElements = hiddenElements.reverse(); 
 
    hiddenElements.push($(this).attr("class")); 
 
    hiddenElements = hiddenElements.reverse(); 
 
    $(this).hide(); 
 
}); 
 

 
$("body").on('click', 'button', function(e) { 
 
    $("." + hiddenElements.pop()).show(); 
 
});

div{ 
 
border:1px solid gray; 
 
padding 15px; 
 
margin: 5px; 
 
text-align: center; 
 
cursor:pointer;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
 
<div class="test1">anything1</div> 
 
<div class="test2">anything2</div> 
 
<div class="test3">anything3</div> 
 

 
<br><br> 
 
<button>show that element which is hide </button>

逆向使用hiddenElements = hiddenElements.reverse();陣列。

來源

2015-12-07 00:00:10

好。但請將該陣列添加到您的解決方案中。 *（因爲其實這是我的主要問題）* – Shafizadeh

@Shafizadeh我剛剛添加。 '：'' –

''太快':-)'，但我不知道爲什麼當我點擊那個按鈕時，沒有任何反應。 – Shafizadeh

正如在評論中提到@adeneo，這將是罰款：

正常秩序：

var arr = []; 
 

 
$("div").click(function(e) { 
 
    arr.push($(this).hide()); 
 
}); 
 

 
$(document).on('click', '.close_cmnt_edit', function(e) { 
 
    arr.pop().show(); 
 
});

div{ 
 
border:1px solid gray; 
 
padding 15px; 
 
margin: 5px; 
 
text-align: center; 
 
cursor:pointer;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
 
<div class="test1">anything1</div> 
 
<div class="test2">anything2</div> 
 
<div class="test3">anything3</div> 
 
<br><br> 
 
<button class="close_cmnt_edit">show that element which is hide </button>

相反的順序：（我想要的東西在問題）

var arr = []; 
 

 
$("div").click(function(e) { 
 
    arr.push($(this).hide()); 
 
}); 
 

 
$(document).on('click', '.close_cmnt_edit', function(e) { 
 
    arr.shift().show(); 
 
});

div{ 
 
border:1px solid gray; 
 
padding 15px; 
 
margin: 5px; 
 
text-align: center; 
 
cursor:pointer;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
 
<div class="test1">anything1</div> 
 
<div class="test2">anything2</div> 
 
<div class="test3">anything3</div> 
 
<br><br> 
 
<button class="close_cmnt_edit">show that element which is hide </button>

來源

2015-12-07 00:30:08 Shafizadeh

顯示隱藏的元素

回答

相關問題