怎么用jquery实现,点击“继续”,隐藏当前div,显示下一个div,点击“返回”隐藏当前div,显示上一个div
发布网友
发布时间:2022-06-09 12:45
我来回答
共1个回答
热心网友
时间:2023-10-01 14:58
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script type="text/javascript" src="jquery_1_7.js"></script>
</head>
<body>
<div id="box">
<div style="display:block;">11111</div>
<div style="display:none;">2222</div>
<div style="display:none;">3333</div>
</div>
<input type="button" value="返回" onClick="ReturnPrev('#box');">
<input type="button" value="继续" onClick="ReturnNext('#box');">
</body>
</html>
<script type="text/javascript">
function ReturnNext(id){
var divLen = $(id).find("div").length;
var Thisdiv = 0;
for(var i=0;i<divLen;i++){if($(id).find("div").eq(i).css("display")!="none"){Thisdiv = i;};};
if(Thisdiv<divLen-1){$(id).find("div").hide().eq(Thisdiv+1).show();};
};
function ReturnPrev(id){
var divLen = $(id).find("div").length;
var Thisdiv = 0;
for(var i=0;i<divLen;i++){if($(id).find("div").eq(i).css("display")!="none"){Thisdiv = i;};};
if(Thisdiv!=0){$(id).find("div").hide().eq(Thisdiv-1).show();};
};
</script>