如何slidetoggle多个div?

时间:2015-02-16 12:09:44

标签: java jquery function toggle slide

我在使用slideToggle代码时遇到了一些问题。

这就是我所拥有的(JQuery)

$(document).ready(function(){

    $("#ava-esimene").click(function() {
            $(this).toggleClass("active");
            $("#ava-teine").removeClass("active"); 
            $("#ava-kolmas").removeClass("active");
            $("#teine-button").slideUp('slow', function() {
            $("#kolmas-button").slideUp('slow', function() {  
              $("#esimene-button").slideToggle(400);
            });
    });


    $("#ava-teine").click(function() {
            $(this).toggleClass("active");
            $("#ava-esimene").removeClass("active");
            $("#ava-kolmas").removeClass("active");
            $("#esimene-button").slideUp('slow', function() {
            $("#kolmaa-button").slideUp('slow', function() {
                $("#teine-button").slideToggle(400);
           });
    });

    $("ava-kolmas").click(function() {
            $(this).toggleClass("active");
            $("#ava-esimene").removeClass("active");
            $("#ava-teine").removeClass("active");
            $("#esimene-button").slideUp('slow', function() {
            $("#teine-button").slideUp('slow', function() {
                $("#teine-button").slideToggle(400);
                });
    });

});

有人可以让它工作吗?

2 个答案:

答案 0 :(得分:0)

   $("#ava-esimene").click(function() {
    $(this).toggleClass("active");
    $("#ava-teine").removeClass("active"); 
    $("#ava-kolmas").removeClass("active");
    $("#teine-button").slideUp('slow', function() {
    $("#kolmas-button").slideUp('slow', function() {  
      $("#esimene-button").slideToggle(400);
    });
});


 $("#ava-teine").click(function() {
    $(this).toggleClass("active");
    $("#ava-esimene").removeClass("active");
    $("#ava-kolmas").removeClass("active");
    $("#esimene-button").slideUp('slow', function() {
    $("#kolmaa-button").slideUp('slow', function() {
        $("#teine-button").slideToggle(400);
   });
 });

  $("#ava-kolmas").click(function() {
    $(this).toggleClass("active");
    $("#ava-esimene").removeClass("active");
    $("#ava-teine").removeClass("active");
    $("#esimene-button").slideUp('slow', function() {
    $("#teine-button").slideUp('slow', function() {
        $("#teine-button").slideToggle(400);
        });
 });

你忘记了ava-kolmas之前的#

答案 1 :(得分:0)

$(document).ready(function(){

$("#ava-esimene").click(function() {
    $(this).toggleClass("active");
    $("#ava-teine").removeClass("active"); 
    $("#ava-kolmas").removeClass("active");
    $("#teine-button").slideUp('slow', function() {
        $("#kolmas-button").slideUp('slow', function() {  
            $("#esimene-button").slideToggle(400);
        });
    })});


$("#ava-teine").click(function() {
    $(this).toggleClass("active");
    $("#ava-esimene").removeClass("active");
    $("#ava-kolmas").removeClass("active");
    $("#esimene-button").slideUp('slow', function() {
        $("#kolmaa-button").slideUp('slow', function() {
            $("#teine-button").slideToggle(400);
        });
    })});

    $("#ava-kolmas").click(function() {
        $(this).toggleClass("active");
        $("#ava-esimene").removeClass("active");
        $("#ava-teine").removeClass("active");
        $("#esimene-button").slideUp('slow', function() {
            $("#teine-button").slideUp('slow', function() {
                $("#kolmas-button").slideToggle(400);
            });
        });

    })
});

你错过了你的功能关闭配置试试这个