jquery显示隐藏多个div代码？
$("#ds1").toggle(function(){$("#s1").hide();$("#ds1").html("展开>>");},function(){$("#s...
$("#ds1").toggle(function(){
$("#s1").hide();
$("#ds1").html("展开>>");
},function(){
$("#s1").show();
$("#ds1").html("隐藏>>");
});
$("#ds2").toggle(function(){
$("#s2").hide();
$("#ds2").html("展开>>");
},function(){
$("#s2").show();
$("#ds2").html("隐藏>>");
});
$("#ds3").toggle(function(){
$("#s3").hide();
$("#ds3").html("展开>>");
},function(){
$("#s3").show();
$("#ds3").html("隐藏>>");
});这样写就太累赘了？？？请教高手帮忙 展开
$("#s1").hide();
$("#ds1").html("展开>>");
},function(){
$("#s1").show();
$("#ds1").html("隐藏>>");
});
$("#ds2").toggle(function(){
$("#s2").hide();
$("#ds2").html("展开>>");
},function(){
$("#s2").show();
$("#ds2").html("隐藏>>");
});
$("#ds3").toggle(function(){
$("#s3").hide();
$("#ds3").html("展开>>");
},function(){
$("#s3").show();
$("#ds3").html("隐藏>>");
});这样写就太累赘了？？？请教高手帮忙 展开
展开全部
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<script language="javascript" src="/js/jquery-1.4.4.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function (){
$("[id^='ds']").each(function(){
var s = "s" + this.id.replace("ds","");
$(this).toggle(function(){
$("#"+s).hide();
$(this).html("展开>>");
},function(){
$("#"+s).show();
$(this).html("隐藏>>");
});
});
})
</script>
<body>
<div id="ds1">隐藏>></div>
<span id="s1">111111</span>
<div id="ds2">隐藏>></div>
<span id="s2">222222</span>
<div id="ds3">隐藏>></div>
<span id="s3">333333</span>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<script language="javascript" src="/js/jquery-1.4.4.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function (){
$("[id^='ds']").each(function(){
var s = "s" + this.id.replace("ds","");
$(this).toggle(function(){
$("#"+s).hide();
$(this).html("展开>>");
},function(){
$("#"+s).show();
$(this).html("隐藏>>");
});
});
})
</script>
<body>
<div id="ds1">隐藏>></div>
<span id="s1">111111</span>
<div id="ds2">隐藏>></div>
<span id="s2">222222</span>
<div id="ds3">隐藏>></div>
<span id="s3">333333</span>
</body>
</html>
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
你可以给这些div都定义同一个class
或者循环~ - - 你这有规律不是~
function Auto_toggle(obj1,obj2){
obj1.toggle(function(){
obj2.hide();
obj1.html("展开>>");
},function(){
obj2.show();
obj1.html("隐藏>>");
});
}
for(var i=1 ;i<=3 ;i++){
Auto_toggle($("#ds"+i),$("#s"+i));
}
-------------------------------------------------------------方法2------------
ds的div都定义成class=‘ds’ s的div~class=‘s’
那么
$(".ds").toggle(function(){
$(".s").hide();
$(".ds").html("展开>>");
},function(){
$(".s").show();
$(".ds").html("隐藏>>");
});
或者循环~ - - 你这有规律不是~
function Auto_toggle(obj1,obj2){
obj1.toggle(function(){
obj2.hide();
obj1.html("展开>>");
},function(){
obj2.show();
obj1.html("隐藏>>");
});
}
for(var i=1 ;i<=3 ;i++){
Auto_toggle($("#ds"+i),$("#s"+i));
}
-------------------------------------------------------------方法2------------
ds的div都定义成class=‘ds’ s的div~class=‘s’
那么
$(".ds").toggle(function(){
$(".s").hide();
$(".ds").html("展开>>");
},function(){
$(".s").show();
$(".ds").html("隐藏>>");
});
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
