如何使用jQuery從跨度最接近的跨度中移除一個類？

Question

我有一個頁面，允許訪客將收藏夾添加到列表中。它使用重複行來顯示項目，所以泛型類重複。

如何顯示單個模態窗口（.closest或.prev？），如果它們都具有相同的類別？

這裏是我的小提琴：http://jsfiddle.net/psasj74L/

<span class="jsCrateMaxModal most-wanted-modal-container hide"> 
    <div class="most-wanted-modal"> 
     <div class="most-wanted-content"> 
      One. 
      <div class="col-xs-12"> 
       <div class="btn-primary btn-block">OK</div> 
      </div> 
     </div> 
    </div> 
</span> 
<button class="jsShowMaxModal mostWantedOff">Show Modal</button> 

的jQuery：

$('.jsShowMaxModal').click(function() { 
    $(".jsCrateMaxModal").closest("span").removeClass("hide"); 
}); 

$('.most-wanted-modal-container').click(function() { 
    $('.jsCrateMaxModal').addClass("hide"); 
}); 

Answer 1

您可以使用.prev()在這種情況下找到按鈕之前的模式。

$('.jsShowMaxModal').click(function() { 
    $(this).prev(".jsCrateMaxModal").closest("span").removeClass("hide"); 
}); 

工作例如：http://jsfiddle.net/psasj74L/2/

然而，這是一個小片狀，我會建議包裝的跨度和按鈕在一個div它提供了一些邏輯分組。如果這是不可能的，另一種方法是使用數據屬性來指定按鈕應該打開的模式。