js控制多个div隐藏显示

例如：
+ sssssss
+ aaaaaa
当点击加号时隐藏加号后面的数据再点击加号时显示数据因为数据是从数据库读出来的我不可能每一条都写个id在写显示和隐藏的方法求高手解答

举报该问题

第1个回答 2012-11-27

简单的写了一小段代码,你可以试试看,如果有用,请选为满意回答.
<body>
<script type="text/javascript">
window.onload=function(){
var os=document.getElementsByTagName('div');
for(var i=0;i<os.length;i++){
os[i].firstChild.setAttribute('onclick','javascript:showhide(this.nextSibling);');
}
};
function showhide(o){
o.style.display=(o.style.display!='none'?'none':'inline');
}
</script>
<div><span>+</span><span>ssssssssss</span></div>
<div><span>+</span><span>aaaaaaaaaa</span></div>
<div><span>+</span><span>bbbbbbbbbb</span></div>
</body>追问

os[i].firstChild.setAttribute('onclick','javascript:showhide(this.nextSibling);');在ie中能用吗？我说的加号其实是按钮可以直接添加onclick事件，这段代码不能运行啊？

追答

我是在FireFox下测试的,IE还真没试,不过思路是这样的,如果只在IE下反倒更简单了,用.Event.srcElement来取事件源对象更容易了.

IE下你可以试试这个,但我没有环境无法测试,你只好自己试了

window.onload=function(){
var os=document.getElementsByTagName('div');
for(var i=0;i

追问

还是不行，有没有别的方法？
function dis() {
if(document.getElementById("dis").style.display=="none") {
document.getElementById("dis").style.display="";
}else{
document.getElementById("dis").style.display="none";
}
}
这是我用的方法通过按钮但不管我有几个div都只能控制第一个div的显示和隐藏能不能在这基础上实现啊

追答

现在没有IE,无法调试,但是我给出的第一段代码在FireFox,Chrome,Opera上都可以执行,我想在IE下应该也可以,如果不行的话,那第二段也应该可以.
你的代码都是通过ID来选择对象的,没办法改.你可以在我的代码基础上修改.

本回答被提问者和网友采纳

第2个回答 2012-11-27

<body>
<script type="text/javascript">
function showdiv(){
for(var i=0;i<4;i++){
alert(i);
document.getElementById(i).style.display="block";
}
};
</script>
<div onclick="showdiv()">显示</div>
<div id="0" style="display:none"><span>ssssssssss</span></div>
<div id="1" style="display:none"><span>ssssssssss</span></div>
<div id="2" style="display:none"><span>aaaaaaaaaa</span></div>
<div id="3" style="display:none"><span>bbbbbbbbbb</span></div>
</body>
运行下试试，我这试了没问题的追问

不用试了，我需要操作的数据数目是不固定的，而不是你现在写的只有4条数据。

第3个回答 2012-11-29

把加号放在内容的父级标签里
然后当点击该加号时用this然后将其子标签隐藏或显示
因为用this 他只会对其本身进行操作就不用给每个都加ID了
具体的代码我就不写了
看你也应该能看明白

相似回答

大家正在搜