0

次のマークアップがあります。

<div class="model-timeline">
        <p>Text</p>
        <div class="timeline">
            <div class="span-blank-5"></div>
            <div class="time-span-1"></div>
            <div class="time-span-2"></div>
            <div class="time-span-2"></div>
        </div>
    </div>
<div class="model-timeline">
        <p>Text</p>
        <div class="timeline">
            <div class="span-blank-5"></div>
            <div class="time-span-1"></div>
            <div class="time-span-2"></div>
            <div class="time-span-2"></div>
        </div>
    </div>

およびスクリプト。

    $('[class*="time-span"]').on('click', function () {
    $('.model-detail-panel').insertAfter('.timeline').slideDown('fast', function () {
        $('html,body').animate({
            scrollTop: $(this).offset().top
        }, 500);
    });
});

タイムスパンクラスの1つをクリックした後、新しいdiv'model-detail-panel'を挿入する必要があります。

この新しいdivは、タイムラインクラスの後に表示され、クリックされたタイムラインクラスの親div内にのみ表示されます。

私が持っているコードはdivを挿入していますが、それは私が必要とする動作ではないすべてのタイムラインクラスの後に追加しています。

クリックされた要素の親のみをターゲットにするようにコードを変更して、divを1回挿入するにはどうすればよいですか？

前もって感謝します。

4

1 に答える 1

4

使用する

 $('.model-detail-panel').insertAfter($(this).parent()) ...

これにより、クリックした要素の親の後にパネルが挿入されます。

于 2012-10-16T10:35:15.617 に答える