用于替换重复元素的长列表中的内容的目标特定元素

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);