1

我在 stackoverflow 上寻找解决方案，但没有找到。我的问题是我在我的网站上做了一个扰流板，它滑动切换得很好，但我希望它在滑动时改变班级并返回当前班级。但是我制作了多个我不想要的具有相同类的 div，当我单击所有扰流板都将打开并更改类的不同扰流板时。

<a class="show-hide" data-divId="stats1" href="javascript:void(0)">
<div class="spoiler-kop1">
    <span class="toer-kop-text">Toernooi 1</span>
</div>
</a>
<div class="spoiler-img">
    <div class="toernooi-info">
        <table border="0">
          <tr>
            <td>Start datum:</td>
            <td>30-10-2013</td>
          </tr>
          <tr>
            <td>Eind datum: </td>
            <td>30-10-2013</td>
          </tr>
           <tr>
            <td>Eind datum: </td>
            <td>30-10-2013</td>
          </tr>
          <tr>
            <td>Teams:</td>
            <td> TCA , Curse , TSM , TGA<br/> RC , DHD , DDG , DODO </td>
          </tr>
          <tr>
            <td>Type: </td>
            <td>2 vs 2</td>
          </tr>
          <tr>
            <td>Map:</td>
            <td>Howeling Abyss</td>
          </tr>
        </table> 
    </div>
    <a class="toernooi-img" href="../classes/fancybox/images/1-big.png"><img src="../classes/fancybox/images/1-small.png" alt=""/></a>
</div>

这是Jquery

$(document).ready(function() {
    $('.show-hide').click(function() {
        $(this).next('div').slideToggle();
    });
});
4

1 回答 1

0

你可以尝试这样的事情：

$(document).ready(function() {
    $('.show-hide').click(function() {
        var $this = $( this );
        $this.removeClass( 'show-hide' ).addClass( 'someNewClass' );
        $this.next( 'div' ).slideToggle( 'slow', function() {
            $this.removeClass( 'someNewClass' ).addClass( 'show-hide' );
        });
    });
});

如您所见slideToggle，函数支持动画完成后的回调。

于 2013-10-30T19:04:01.970 回答