jquery - クラスをdivに追加できない

Question

私は次の div を持っています:

<div class="overlay">
    <a title="yes" href="#"><div class="yes"></div></a>
    <a title="no" href="#"><div class="no"></div></a>
</div>

<div class="movie item-parent">
    <a title="Sin city" class="movie-link">
        <img src="images/1.jpg" />
    </a>
    <div class="overlay">
        <a title="yes" href="#"><div class="yes"></div></a>
        <a title="no" href="#"><div class="no"></div></a>
    </div>
</div>

ユーザーが「いいえ」をクリックすると、次のようにシンシティが newproducts.jsp にある別のムービーに置き換えられます。

<div class="movie item-parent">
    <a title="The Hobbit" class="movie-link">
        <img src="images/2.jpg" />
    </a>
    <div class="overlay">
        <a title="yes" href="#"><div class="yes"></div></a>
        <a title="no" href="#"><div class="no"></div></a>
    </div>
</div>

私のjqueryコードは次のとおりです。

$('.no').on("click", function(){
    var parent_movie= $(this).parent('.movie');
    parent_movie.empty();
    parent_movie.load("reco_product_stream.jsp a"); 
    parent_movie.append($('.overlay'));
});

しかし、映画は置き換えられていません。

に変更.parentする.parentsと、映画は正常に置き換えられますが.overlay、ページ上の他のすべての映画から削除され、.append.

Answer 1

親が直接の親に見え、最も近いものが最初の一致の dom を検索するclosest()代わりに使用します。parent()

var parent_movie= $(this).closest('.movie');

Answer 2

$('.no').on("click", function(){
    var $parent_movie = $(this).closest('.movie');
    $.get('reco_product_stream.jsp', function(data) {
        var $a = $(data).find('a'); 
        $parent_movie.children('a').replaceWith($a); 
    })
});

Answer 3

あなたのコード行:

var parent_movie = $(this).parent('.movie');

直接の親だけを見て、その直接の親に class がある場合にのみ一致しmovieます。HTML ではそうではないため、空の jQuery オブジェクトが生成され、後続のコード行は何も実行しません。

movieクラスが見つかるまで親チェーンを検索したいので、代わりにこれを使用します。

var parent_movie = $(this).closest('.movie');

Answer 4

以下を使用できます。

var parent_movie = $(this).closest('.movie');