添加班級鏈接slu based基於關閉slu塊數組

Question

我正在創建一個配方工具，通過選定的複選框來接受用戶的輸入。看到這裏：zelda.wptoolkit.us

第一部分： 我有一個腳本，將創建一個基於選定輸入值的slug數組。當用戶點擊一個複選框時，關聯的slug被添加到名爲checkedAttr的數組中。兩個

<script> 
var checkedAttr = []; 

$('#wp-advanced-search :checkbox').change(function() 
{ 
checkedAttr = []; 
$('#wp-advanced-search :checkbox').each(function(i, item){ 
    if($(item).is(':checked')) 
    { 
     checkedAttr.push($(item).val()); 
    } 
}); 
console.log("checkedAttr:", checkedAttr); 
}); 
</script> 

部分： 我嘗試使用下面.addClass代碼包含從第一部分在陣列中發現蛞蝓的任何鏈接。

鏈接結構：http://zelda.wptoolkit.us/tag/any-crab/

代碼：

<script type="text/javascript"> 
jQuery(function() { 
jQuery('#wpas-results-inner > div > div > p > a[href^="/tag/' + 
location.pathname.split("/") this.checkedAttr[0] + '"]').addClass('active'); 
}); 
</script> 

什麼我的目標做的是針對每個卡的鏈接，然後添加一個類，其塞在被發現的鏈接我陣列。最終目標是突出檢查「成分」並淡化未檢查過的成分。

我不確定如何使這個函數檢查我的數組爲每個slu I，我很想知道需要什麼步驟來完成這個！

我也不能肯定，如果我的jQuery的CSS的路徑是否正確瞄準鏈接

感謝您的見解！

Answer 1

如果您正在尋找類似於選擇特定複選框之類的東西，則應該啓用與該複選框相關的所有卡（可以應用任何類active），並且一旦您取消選中該複選框，我們需要刪除該特定類從所有相關的複選框？

你可以檢查給定的小提琴。 https://jsfiddle.net/stdeepak22/x1L95dw3/1/

var checkedAttr = []; 

$('#checkBoxForCategory :checkbox').change(function() 
{ 
     var cardCategory = $(this).val();  
    var allCards = $('.myCard[card-category=' + cardCategory + ']'); 

    if($(this).is(':checked')) 
    { 
      //add the selected category to array 
     checkedAttr.push(cardCategory); 

     //add the `active` class for all the card belongs to selected category 
     $(allCards).each(function() 
     { 
      $(this).addClass('active'); 
     }); 
    } 
    else 
    { 
     //remove from array 
     var index = checkedAttr.indexOf(cardCategory); 
     checkedAttr.splice(index, 1); 

     //remove the class for all the card belongs to selected category 
     $(allCards).each(function() 
     { 
     $(this).removeClass('active'); 
     }); 
    }  

    console.log("checkedAttr:", checkedAttr); 
});