用於替換重複元素的長列表中的內容的目標特定元素

Question

我正在顯示單個頁面上的動態內容列表，其中每個內容都具有相同的標誌和按鈕。我希望用戶能夠點擊一個「贊」按鈕，並使該項的「不喜歡」按鈕被禁用，反之亦然。

我的問題是這樣的：如果用戶點擊「不喜歡」，那麼頁面上的所有「贊」按鈕都會被禁用。我只想爲該條目關聯的「贊」按鈕受到影響。

我有這個代碼部分工作，但正如我所說，它會更改頁面上的所有按鈕。如何更新其中的一個內容？

注意：這些按鈕的功能的後端處理工作正常，這個問題只關於jquery和bootstrap功能。非常感謝。

<div class="text-right"> 
<span class="like"><a class="likelink btn btn-info btn-xs" href="{path='sightings/ajax_like'}/{entry_id}"><span class="glyphicon glyphicon-thumbs-up" aria-hidden="true"></span></a></span> 
<span class="flag"><a class="flaglink btn btn-info btn-xs" href="{path='sightings/ajax_flag'}/{entry_id}"><span class="glyphicon glyphicon-thumbs-down" aria-hidden="true"></span></a></span> 
</div> 

<div class="text-right"> 
<span class="like"><a class="likelink btn btn-info btn-xs" href="{path='sightings/ajax_like'}/{entry_id}"><span class="glyphicon glyphicon-thumbs-up" aria-hidden="true"></span></a></span> 
<span class="flag"><a class="flaglink btn btn-info btn-xs" href="{path='sightings/ajax_flag'}/{entry_id}"><span class="glyphicon glyphicon-thumbs-down" aria-hidden="true"></span></a></span> 
</div> 

<div class="text-right"> 
<span class="like"><a class="likelink btn btn-info btn-xs" href="{path='sightings/ajax_like'}/{entry_id}"><span class="glyphicon glyphicon-thumbs-up" aria-hidden="true"></span></a></span> 
<span class="flag"><a class="flaglink btn btn-info btn-xs" href="{path='sightings/ajax_flag'}/{entry_id}"><span class="glyphicon glyphicon-thumbs-down" aria-hidden="true"></span></a></span> 
</div> 


$(document).ready(function(){ 

// FLAGGING 

    $('a.flaglink').on('click', function(e){ 
     e.preventDefault(); 
     var flaglink = $(this); 
     var url = flaglink.attr('href'); 
     if (url !== null) { 
      $.ajax({ 
       url: url, 
       success: function(results) { 

        flaglink.closest('.flag').html('<a href="#" class="flaglink btn btn-xs btn-danger" title="flagged"><span class="glyphicon glyphicon-thumbs-down" aria-hidden="true"></span> Flagged</a>').fadeIn('slow'); 
        $('span.like').closest('a.likelink').prop('disabled', true); 

       }, 
       error: function(results) { 
        console.log('ERROR:' + results); 
       } 
      }); 
     } // if 

    }); // flag 


}); // document ready 

Answer 1

你已經擁有的flaglink的實例，以便使用特定的實例從遍歷，而不是更通用$('span.like')，其中包括所有的類存在

喜歡的東西的：

flaglink.parent().siblings('.like').find('a.likelink').prop('disabled', true);