1

まず第一に私の弱い英語で申し訳ありませんが、私はslide.toggle関数を使用し、1つの要素がある場合はうまく機能しますが、複数の要素（divタグ）を追加するとクラッシュするか、IDをチャンドすると最初の要素だけで機能しますjavascript のクラス属性に、それはすべての要素に作用しますが、どの要素がクリックされたかだけに作用し、その要素のサイズを変更したいのですが、他の要素やすべての要素ではなく、検索し$(this).parent(".slidingDiv").slideToggle();て、問題を解決できるようです、しかし、JavaScriptで設定する方法がわかりません。ここにURLがあります：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