Question

我正在通过创建一个投资组合网站来破解我的方式，并且对组合元素的Javascript / Jquery过滤有点不了解。由于我是新手，我使用一个非常基本的过滤器来保持事情尽可能简单，该过滤器显示/隐藏未排序列表“组合”中的元素，使用另一个过滤器作为过滤器“过滤器”，当它被点击时。

在页面本身，工作正常，链接正在过滤，但我想在网站的其他地方添加一个链接回到投资组合页面，该页面将使用#value相应地过滤投资组合。例如，我想要“portfolio.html＃things”链接将'things'的过滤器应用到我的列表中。谷歌搜索/拖网搜索这些部分之后，我已经不知所措并被发现了。

任何人都可以帮助一个总菜鸟吗？我用js和html创建了一个JSFiddle，我现在正在使用它：http://jsfiddle.net/2x7xme5u/6/

这就是我现在正在使用的js：

$(document).ready(function() {
$('ul#filter a').click(function () {
$(this).css('outline', 'none');
$('ul#filter .current').removeClass('current');
$(this).parent().addClass('current');

var filterVal = $(this).text().toLowerCase().replace(' ', '-');

if (filterVal == 'all') {
    $('ul#portfolio li.hidden').fadeIn('slow').removeClass('hidden');
} else {

    $('ul#portfolio li').each(function () {
        if (!$(this).hasClass(filterVal)) {
            $(this).fadeOut('slow').addClass('hidden');
        } else {
            $(this).fadeIn('slow').removeClass('hidden');
        }
    });
}

return false;

道歉，如果我错过了一些明显的明显信息！

尔加！ - 现在与公共小提琴。（对不起）

提前致谢。

Answer 1

您可以使用

获取锚标记

var url = window.location.href;
var anchor = url.substring(url.indexOf("#"));
var tag = anchor.substring(1);

if (tag) {
    if (tag == 'all') {
        $('ul#portfolio li.hidden').show();
    } else {

        $('ul#portfolio li').each(function () {
            if (!$(this).hasClass(tag)) {
                $(this).hide().addClass('hidden');
            } else {
                $(this).show().removeClass('hidden');
            }
        });
    }
}

请参阅jsFiddle http://jsfiddle.net/bevanr01/bs45px6f/7/

在页面加载时使用URL #value过滤未排序的列表

1 个答案: