jQuery replaceWith（）$ this

Question

當我單擊以顯示它們時，我需要隱藏「顯示答覆」。問題是，當我點擊「顯示回覆」時，所有「顯示回覆」按鈕隱藏。我只需要隱藏那個我點擊的那個。這是jQuery代碼：

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

Answer 1

$(".replies_show")選擇具有類的所有元素，因此你選擇所有這些，然後再施加replaceWith到所有這些。但是，該回調函數內部的this指的是剛剛單擊的元素（即只有單擊的元素不是全部）。

此外，不要使用replaceWith函數只是爲了隱藏一個元素，而是使用.hide()來代替。

所以，更換

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

隨着

$(this).hide(); 

Answer 2

您可以使用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(); 
});