css - 如何使按钮在单击时消失并显示另一个按钮？

Question

是否可以将某些按钮设为可见，但当您单击该按钮时，它会变得不隐藏？

就像你有一个按钮并点击那个按钮，那个按钮消失并显示更多 3 个按钮，如果你点击它们中的任何一个，它会同样消失并显示其他东西，比如更多按钮？

<button onClick="document.getElementById('d3').style.display='block'"></button>

Answer 1

考虑到您的解释并没有给我太多帮助，这里有一些我认为您正在寻找的东西的 super 简单实现。

这是一个工作演示:http://jsfiddle.net/jonsuh/AG3Fz

CSS

<style>
#d3 {
    display: none;
}
</style>

HTML 和 JavaScript

<input id="button" type="button" value="Show more" onclick="showMore()">
<div id="d3">
    <input type="button" value="Show less" onclick="showLess()">
    <input type="button" value="Show less" onclick="showLess()">
    <input type="button" value="Show less" onclick="showLess()">
</div>
<script type="text/javascript">
var button = document.getElementById("button");
var d3 = document.getElementById("d3");

function showMore() {
    button.style.display="none";
    d3.style.display="block";
}

function showLess() {
    button.style.display="inline-block";
    d3.style.display="none";
}
</script>