jQuery replaceWith（）$ this

Question

私はクリックして表示すると「返信を表示」を非表示にする必要があります。問題は、「回答を表示」をクリックすると、すべての「回答を表示」ボタンが隠れてしまうことです。私はクリックしたものだけを隠す必要があります。したがって、あなたがそれらのすべてを選択しているし、再度それらのすべてにreplaceWithを適用し、

  $(".replies_show").click (function(e){ 
      $(".replies_show").replaceWith(" "); 
      $(this).next(".replies").show(); 
      e.preventDefault(); 
     }); 

Answer 1

$(".replies_show")クラスを持つすべての要素を選択します。これは、jQueryのコードです。ただし、そのコールバック関数内のthisは、ちょうどクリックされた要素（つまり、すべてではないクリックされた要素のみ）を参照します。

また、replaceWith機能を使用して要素を非表示にするだけではなく、代わりに.hide()を使用してください。

ので、

$(this).hide(); 

Answer 2

で

$(".replies_show").replaceWith(" "); 

を交換するあなたは、現在の要素を取得するためにthisを使用することができます。それ以外の場合は、.replies_showクラスのすべての要素を選択しています。

$('.replies_show').on('click', function(e, el) { 
 
    $(el).replaceWith(' '); // Does what you're looking for 
 

 
    $(el).hide(); // Might be better, depending on what you're doing 
 
    
 
    $(this).next('.replies').show(); 
 
    
 
    e.preventDefault(); 
 
});

Answer 3

使用.hide()機能しませ.replaceWith()

$(".replies_show").click (function(e){ 
      $(this).hide(); 
      $(this).next(".replies").show(); 
      e.preventDefault(); 
     }); 

Answer 4

あなただけclickedアイテムをターゲット必要なので、あなたは、コールバック関数で$(this)を使用する必要があるとして、以下のようなもの：

$(".replies_show").click (function(e){ 
    var $this = $(this); // cache $(this)/clicked element 

    $this.hide();   // clicked item will be hide (display: none) 
    $this.next(".replies") // next matched item of clicked item 
     .show();   

    e.preventDefault(); 
});