0

ヘッダーをクリックして、コンテンツ、アコーディオン スタイルを切り替えようとしています。これが私の例です。Firebug を実行すると、.click 関数が呼び出されますが、アコーディオンのコンテンツは切り替わりません。いくつかの異なるセレクターの組み合わせを試しましたが、成功しませんでした。

任意の提案をいただければ幸いです。

ありがとう

 <style type="text/css">

.content { display: none;}

</style>
<div class="accordion complete" id="step_1">
  <div class="accordion-tab">Step 1.</div>
    <span>
      <div class="content">
        <p>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque blandit aliquam malesuada. 

        </p>
    </div>
   </span>
</div>

<script type="text/javascript">

    $(document).ready(function() {

        $(".accordion-tab").click(function(e) {

            e.preventDefault();
            $(this).closest('span').find('.content').not(':animated').slideToggle();


        });

    });
</script>
4

2 に答える 2

2

.closest()ではなく.next( )が必要です

最も近い -> 説明: セット内の各要素について、要素自体をテストし、DOM ツリー内のその祖先をたどることによって、セレクターに一致する最初の要素を取得します。

最も近いものは、現在の要素または DOM の祖先に一致します。


next ->説明: 一致した要素のセット内の各要素の直後の兄弟を取得します。セレクターが指定されている場合、そのセレクターに一致する場合にのみ、次の兄弟を取得します。

デモ

$(document).ready(function () {
    $(".accordion-tab").click(function (e) {
        e.preventDefault();
        $(this).next('span').find('.content').not(':animated').slideToggle();
    });
});
于 2013-09-24T01:29:03.317 に答える
0

この "closest('span') は、子ではなく先祖を検索しているため、取得できると思います: JQuery#closest

したがって、クエリは次のようにする必要があります。

$(this).find('.content').not(':animated').slideToggle();

ヒントとして、お気に入りのブラウザーのコンソールで常に jquery の選択シーケンスをテストしてください。非常に簡単に迷子になります。

于 2013-09-24T01:31:44.720 に答える