1

誰かが私のサイトのアイテムをクリックした後に、詳細情報を追加しようとしています。

これが私の通常のコードです（Bootstrap 3です）：

<div class="container">
    <div class="row">
        <div class="col-sm-6 col-md-4 col-xs-12">
            <div class="portfolio_item">
                <!-- Info -->
            </div>
        </div>
        <div class="col-sm-6 col-md-4 col-xs-12">
            <div class="portfolio_item">
                <!-- Info -->
            </div>
        </div>
        <div class="col-sm-6 col-md-4 col-xs-12">
            <div class="portfolio_item">
                <!-- Info -->
            </div>
        </div>
    </div>

    <div class="row">
        <!-- Same as above -->
    </div>
</div>

div誰かがportfolio_itemをクリックすると、その人がクリックした行の後に新しいものが来るはずです。

$('.portfolio_item').click(function(){    
    var row = $(this).parent().parent();
    row.after('</div><div class="detailview">Detail Information</div><div class="container">');
}

ご覧のとおり、コンテナから脱出します。その部分は機能しません。自分のページのソースコードをログに記録するとき。これは私が見るものです：

<div class="container">
    <div class="row">
        <!-- Same Row Info -->
    </div><div class="detailview">Detail Information</div><div class="container"></div>
    <div class="row">
        <!-- Same Row Info -->
    </div>
</div>

.rowご覧のとおり、 (like append()) の後ではなく、末尾の前に追加されているように見えます。ページに手動で挿入すると、正常に動作します。これをどのように修正すればよいですか？

解決済み:本当に良い答えが見つからなかったので、次のように解決し.containerました。.row.detailview.row.container

4

3 に答える 3

0

最も近い（）を使用する 

$('.portfolio_item').click(function(){    
    var row = $(this).closest(".row");
    row.after('<div class="detailview">Detail Information</div>');
}
于 2013-11-12T13:15:55.170 に答える