1

首先抱歉我的英语很差，我使用 slide.toggle 功能，当我有一个元素时它工作得很好，但是当我添加多个元素（div 标签）时，它崩溃或只为第一个元素工作，如果我得到 id到 javascript 中的类属性，它作用于所有元素，但我想只作用于已单击的元素，并更改该元素的大小而不是其他元素或所有元素，我搜索了，似乎$(this).parent(".slidingDiv").slideToggle();可以解决我的问题，但我不知道如何在javascript中设置它，这是网址：http://itsun.ir/test/

这是我的项目和问题的现场演示，有人可以帮我解决这个问题吗？

这是我使用的代码：

<script type="text/javascript">
$(document).ready(function() {
    $(".hs").click(function() {

        if (document.getElementById("container").style.display == 'none') {
            document.getElementById("ad").className =
document.getElementById("ad").className.replace
  ( /(?:^|\s)inactive(?!\S)/g , '' )
            document.getElementById("ad").className = " active";

            document.getElementById("au").className =
document.getElementById("au").className.replace
  ( /(?:^|\s)active(?!\S)/g , '' )
            document.getElementById("au").className = " inactive";

        }else{
            document.getElementById("ad").className =
document.getElementById("ad").className.replace
  ( /(?:^|\s)active(?!\S)/g , '' )
            document.getElementById("ad").className = " inactive";


            document.getElementById("au").className =
document.getElementById("au").className.replace
  ( /(?:^|\s)inactive(?!\S)/g , '' )
            document.getElementById("au").className = " active";

        }


    $(".content").slideToggle("slow");




    });
});

这是html代码：

          <div id="wrapper">
              <div class="box" id="box"style="width:95%;">
                <div class="top_bar" style="width:100%; height:40px; background-color:#01afee;">
                                    top bar 1   
                </div>

                <div id="container" class="content" style="display:block;">
                            TExt 1
                </div>
            </div>


            <div class="box" id="box"style="width:95%;">
                <div class="top_bar" style="width:100%; height:40px; background-color:#01afee;">
                                    top bar 2  
                </div>

                <div id="container" class="content" style="display:block;">
                            TExt 2
                </div>
            </div>



            <div class="box" id="box"style="width:95%;">

                <div class="top_bar" style="width:100%; height:40px; background-color:#01afee;">
                                    top bar 3    
                </div>

                <div id="container" class="content" style="display:block;">
                            TExt 3
                </div>
            </div>


        </div>
4

0 回答 0