Jquery一次不能显示1个div

时间:2011-07-24 23:48:26

标签: jquery animation

我在使用jQuery脚本时遇到了一些困难。

我试图一次显示一个div的显示/隐藏。 发生的事情是所有div(.slidingDiv)同时打开。 以下是我的代码:

01.<script src="jquery-1.6.2.min.js" type="text/javascript"></script>
02.<script type="text/javascript">
03.$(document).ready(function(){
04.$(".slidingDiv").hide();
05.$("#btn-swap").show();
06.$("#btn-swap").click(function(){
07.$('.img-swap').each(function(){
08.if($(this).hasClass('on')){
09.this.src = this.src.replace("_off","_on");
10.} else {
11.this.src = this.src.replace("_on","_off");
12.}
13.$(this).toggleClass("on");
14.});
15. 
16.$(".slidingDiv").slideToggle();
17.});
18.});
19.</script>

01.<a href="#" id="btn-swap" >
02.<div  class="togglebg"><table>
03.<tr>
04.<td>&nbsp;&nbsp;&nbsp;<img src="images/plus_on.gif" class="img-swap"/></td>
05.<td width="864" align="center" valign="middle" class="specshead">Engine</td>
06.<td ><img src="images/show_on.gif" class="img-swap"/>&nbsp;</td>
07.</tr>
08.</table>
09.</div></a>
10.<div id="foo"  class="slidingDiv">this is foo</div>
11.<a href="#" id="btn-swap" >
12.<div  class="togglebg"><table >
13.<tr>
14.<td >&nbsp;&nbsp;&nbsp;<img src="images/plus_on.gif" class="img-swap"/></td>
15.<td class="specshead">Engine</td>
16.<td ><img src="images/show_on.gif" class="img-swap"/>&nbsp;</td>
17.</tr>
18.</table>
19.</div></a>
20.<div id="foo2"  class="slidingDiv">this is foo2</div>

3 个答案:

答案 0 :(得分:1)

http://api.jquery.com/show/

匹配的元素会立即显示,没有动画。

见复数

答案 1 :(得分:1)

怎么样

 $(".slidingDiv").each(function(i) {
        $(this).delay(1000*i).hide(0);
    });

答案 2 :(得分:0)

也许你可以使用

function(number) {
    $(".slidingDiv").hide();
    $("#foo".number).show();
}

然后只需要一个接一个地调用带有所有div数字的函数。

相关问题