首页 新闻 会员 周边

jQuery控制多个DIV的显示和隐藏

1
悬赏园豆:5 [已关闭问题] 关闭于 2011-04-01 17:20

比如说有3个DIV,当我点击 下一页的按钮的时候 第一个层要隐藏 第二个层要显示 如此类推..

点击上一页的时候 显示上一个DIV 隐藏当前的DIV

刚学jQuery 求解答!!

问题补充: 这是我写的JS function Previous(){ for(var i=1;i<=3;i++){ if(document.getElementById("d"+i).style.display=="block"){ document.getElementById("d"+(i-1)).style.display="block"; } document.getElementById("d"+i).style.display="none"; } if(document.getElementById("d1").style.display=="block"){ document.getElementById("a1").style.display="none"; }else{ document.getElementById("a1").style.display="block"; document.getElementById("a2").style.display="block"; } } function Next(){ for(var i=3;i>=1;i--){ if(document.getElementById("d"+i).style.display=="block"){ document.getElementById("d"+(i+1)).style.display="block"; } document.getElementById("d"+i).style.display="none"; } if(document.getElementById("d3").style.display=="block"){ document.getElementById("a2").style.display="none"; }else{ document.getElementById("a1").style.display="block"; document.getElementById("a2").style.display="block"; } } <form name="hotailForm" > <div id="d1" name="valiDiv"> <table> <tr> <td> <input name="input1" id="one" value="1" validate="{required: true}"> </td> </tr> </table> </div> <div id="d2" name="valiDiv"> <table> <tr> <td> <input name="input2" id="two" value="2" validate="{required: true}"> </td> </tr> </table> </div> <div id="d3"
solo_code的主页 solo_code | 初学一级 | 园豆:200
提问于:2011-03-09 16:21
< >
分享
所有回答(3)
2

$('xxx').show().siblings().hide();

xxx就负责找到要显示的那个

Gray Zhang | 园豆:17610 (专家六级) | 2011-03-09 16:26
但是有3个DIV啊 怎么动态的更改XXX的值
支持(0) 反对(0) solo_code | 园豆:200 (初学一级) | 2011-03-09 16:31
0

$("div").hide();  //隐藏所有的Div

$("div").eq(n).show();  //显示你想要的那个 n以0开始。

webaspx | 园豆:1973 (小虾三级) | 2011-03-09 16:27
n是匹配什么的 是ID 还是NAME属性
支持(0) 反对(0) solo_code | 园豆:200 (初学一级) | 2011-03-09 16:37
n是三个Div的顺序,第一个为0,依次+1
支持(0) 反对(0) webaspx | 园豆:1973 (小虾三级) | 2011-03-09 16:50
1

在命名上做文章。比如三个div分别叫做:divstep1、divstep2、divstep3 。为button增加onclick事件 nextstep();

//定义当前步骤:
var curr =null;
$(function(){
$(
"div[id*='divstep']").hide();
});
function nextStep()
{
if(curr!=null)
{
$(
'divstep'+curr.ToString()).hide();
curr
=NuMber(curr)++;
$(
'divstep'+curr.toString()).show();
}
else{
$(
'divstep1').show();
curr
=1;
}
}
邢少 | 园豆:10926 (专家六级) | 2011-03-09 16:45
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册