Question

我不明白为什么当我点击过滤器时图像会消失。

Quicksand脚本代码（位于名为jquery.custom.js的文件中）：

jQuery.noConflict();
jQuery(document).ready(function($){
    // Clone applications to get a second collection
    var $data = $("#portfolio-items").clone();

    //NOTE: Only filter on the main portfolio page, not on the subcategory pages
    $('#portfolio-terms ul li').click(function(e) {
        $("ul li").removeClass("active");   
        // Use the last category class as the category to filter by. This means that multiple categories are not supported (yet)
        var filterClass=$(this).attr('class') //.split(' ').slice(-1)[0];
        filterClass = filterClass ? filterClass.split(' ').slice(-1)[0] : '';

        if (filterClass == '.all current') {
            var $filteredData = $data.find('#portfolio-');
        } else {
            var $filteredData = $data.find('#portfolio-[data-type=' + filterClass + ']');
        }
        $("#portfolio-items").quicksand($filteredData, {
            duration: 800,
            easing: 'swing',
        });     
        $(this).addClass("active");             
        return false;
    });
});

在这里，您可以看到 portfolio-items 和 terms 的PHP代码：http://snipt.org/Mnp8

你能帮帮我吗？
谢谢！

Answer 1

$ data.find不是直接搜索属性。什么会起作用就像替换

var $filteredData = $data.find('#portfolio-');

带

var $filteredData = $data.find('li[id|="portfolio"]');

这将搜索id以项目组合开头的所有li

以下行是指LI，而不是a标签。 LI元素没有类。

$(this).attr('class') //.split(' ').slice(-1)[0];

假设您将类放在LI元素上，您可能可以修改此行的更改（我不确定这一行）：

var $filteredData = $data.find('#portfolio-[data-type=' + filterClass + ']')

为：

var $filteredData = $data.find('li.' + filterClass);

请看看 http://jsfiddle.net/bhoover10001/SzjhS/ 并查看这是否或多或少是您想要的功能。

A）您没有将课程放在被点击的LI项目上。

<li class="all"><a href="">All</a><span>/</span></li>
<li class="term-4"><a href="" 
data-value="term-4" title="View all items filed under Colours">Colours</a> <span>/</span>
</li>
<li class="term-3" >
<a href="" data-value="term-3" title="View all items filed under Fotografie">Fotografie</a> <span>/</span>
</li>

B）data-id是您正在显示的项目的LI元素上的必需元素。例如：

<li id="portfolio-12" class="term-4 visible" data-id="post-12">

C）过滤器类应该是每个投资组合中的第一个类。您错误地拆分了过滤器类：

filterClass = filterClass ? filterClass.split(' ')[0] : '';

D）您的“所有”条件编码错误：

if (filterClass == 'all')

为什么jQuery Quicksand中的图像消失了？

1 个答案: