页面正常给了,自己设个按钮。假设4个页面都写在了index.jsp。不考虑其他因素只考虑按钮消失。请解答写方法。
然后我用了style="display:none" 按钮4个全隐藏了。求这么弄才能让第一个按钮隐藏呢。(不是vue框架,普通的jsp)
<html>
<head>
<title>实例</title>
</head>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<body>
<button id="b1"> 页面1 </button>
<button id="b2"> 页面2 </button>
<button id="b3"> 页面3 </button>
<button id="b4"> 页面4 </button>
<br>
<br>
<br>
<br>
<div class="page" id="page1" style="width:100px;height:200px;border:1px solid red;float:left;margin:20px;display:none;">
这是第一个页面
</div>
<div class="page" id="page2" style="width:100px;height:200px;border:1px solid red;float:left;margin:20px;display:none;">
这是第2个页面
</div>
<div class="page" id="page3" style="width:100px;height:200px;border:1px solid red;float:left;margin:20px;display:none;">
这是第3个页面
</div>
<div class="page" id="page4" style="width:100px;height:200px;border:1px solid red;float:left;margin:20px;display:none;">
这是第4个页面
</div>
<div style="float:clear;">
</div>
<br><br><br><br>
<br><br><br><br>
<br><br><br><br>
<button id="btn"> 这个是公共 按钮 </button>
</body>
<script>
$("#b1").click(function(){
$(".page").hide();
//显示页面1;隐藏按钮
$("#page1").show();
$("#btn").hide();
});
$("#b2").click(function(){
$(".page").hide();
//显示页面1;隐藏按钮
$("#page2").show();
$("#btn").show();
});
$("#b3").click(function(){
$(".page").hide();
//显示页面1;隐藏按钮
$("#page3").show();
$("#btn").show();
});
$("#b4").click(function(){
$(".page").hide();
//显示页面1;隐藏按钮
$("#page4").show();
$("#btn").show();
});
</script>
</html>