js實現同壹頁面多個換壹批功能？

首先，不同的組應該放入不同的容器中，這樣便於控制；其次，由於id是具有唯壹性的（就好比身份證不能有重號），所以同壹頁面中不允許存在id相同的元素，像妳這樣有多個id為movie1、movie2、movie3是不行的，當然js不會報錯，但不管妳點擊哪壹組，都只有第壹組才會響應。妳可以改用class（這個允許重名），或者幹脆不用，通過元素間的相互關系來控制。

下面代碼供參考：

<div class="box">

<a href="javascript:" class="change">換壹批A</a>

<div style="display:block;">

<a href="#">1</a><a href="#">2</a><a href="#">3</a>

</div>

<div style="display:none;">

<a href="#">4</a><a href="#">5</a><a href="#">6</a>

</div>

<div style="display:none;">

<a href="#">7</a><a href="#">8</a><a href="#">9</a>

</div>

</div>

<div class="box">

<a href="javascript:" class="change">換壹批B</a>

<div style="display:block;">

<a href="#">1</a><a href="#">2</a><a href="#">3</a>

</div>

<div style="display:none;">

<a href="#">4</a><a href="#">5</a><a href="#">6</a>

</div>

<div style="display:none;">

<a href="#">7</a><a href="#">8</a><a href="#">9</a>

</div>

</div>

<script>

window.onload=function(){

var change=document.querySelectorAll("a.change");

for(var i=0;i<change.length;i++){

change[i].onclick=function(){

var suba=this.parentNode.querySelectorAll("div");

for(var j=0;j<suba.length;j++){

if(suba[j].style.display=="block"){

suba[j].style.display="none";

suba[(j+1)%suba.length].style.display="block";

break;

}

}

}

}

}

</script>

上一篇:誰知道水下觀察者的視覺世界是怎樣的？

下一篇:鋼結構施工工藝？