显示隐藏的元素

我有三个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

显示隐藏的元素

回答

相关问题