更新时间:2023-12-05 20:35:16
我不知道,如果你有这个想法,但通过应用以下选择:
$('div.portfolio项:可见:第一')addClass(第一项);
您可以添加类:第一项
的第一个可见的div(带班组合项
)中,可以用于应用特殊样式用于第一分区。我发现的用处:可见
选择在这个回答
总之,code两线已加入 $ checkboxes.change
功能:
$('div.portfolio项目')removeClass移除(第一项); $('div.portfolio项:可见:第一')。addClass(第一项);
第一行只是清除了previous 第一项
的选择。
I'm trying to remove elements from the DOM only need to be inserted back in again when the corresponding checkbox filter is either true or false. currently i have display none or block, but the reason I want to remove the elements altogether is because I have a specific style on the first child giving it more padding at the top. So currently when I change the filter and a new item is displayed first it currently does not have the padding applied which I need.
The fiddle: http://jsfiddle.net/amesy/kwqpf5fv/6/
The code in the fiddle above...
function StringContainsAllItems(stringVal, items){
if(items.length == 0 || items.length == null){
return false;
}
for(var i = 0; i < items.length; i++){
console.log("Item: " + items[i]);
if(stringVal.indexOf(items[i]) == -1)
{
return false;
}
}
return true;
}
$(function() {
var $checkboxes = $("input[id^='type-']");
$('input[type=checkbox]:checked').attr('checked', false);
$checkboxes.change(function() {
if( $('input[type=checkbox]:checked').length > 0){
var selectorArray = [];
$checkboxes.filter(':checked').each(function() {
selectorArray.push($(this).attr('rel'));
console.log($(this).attr('rel'));
});
$('[data-category]').hide() // hide all rows
.filter(function() {
return StringContainsAllItems($(this).data('category'), selectorArray);
}).show(); // reduce set to matched and show
}else
{
$('[data-category]').show();
}
});
});
I'm not sure if you had this in mind, but by applying the following selector:
$('div.portfolio-item:visible:first').addClass("first-item");
You can add the class: first-item
for the first visible div (with class portfolio-item
), that can be used to apply special styles for the first div. I discovered the usefulness of :visible
selector at this answer.
Altogether, two lines of code have been added into $checkboxes.change
function:
$('div.portfolio-item').removeClass("first-item");
$('div.portfolio-item:visible:first').addClass("first-item");
The first line just clears the previous first-item
selection.