我有很多链接可以过滤多个div,具体取决于数据属性。

现在,我想将链接和结果div分开到单独的页面。 例如:我有带有链接的页面X和带有结果div的页面Y。 当我单击页面X上的链接时,我被定向到页面Y,并显示正确的div。 我将如何以最佳方式做到这一点? 是否可以使用数据属性来执行此操作?

JS

var target;

$('.filter_link').click(function(e) {
    e.preventDefault();

    if (target != $(this).attr('data-related')) {
        $('.blurb-content').removeClass('fade-in-bottom').addClass('blurb--hidden');
        var $blurbsToShow = $('.cat_' + $(this).attr('data-related'));
        $blurbsToShow.each(function(i) {
        var $self = $(this);
            setTimeout(function() {
                $self.removeClass('blurb--hidden').addClass('fade-in-bottom');
            }, 500 * i);
        });
        target = $(this).attr('data-related');

    } else {
        target = '';

        $('.blurb-content').removeClass('blurb--hidden').removeClass('fade-in-bottom');
    }
});

小提琴

  ask by pistevw translate from so

本文未有回复,本站智能推荐:

3回复

使用带有多个复选框的数据属性过滤div

我有一个具有多个数据属性(例如数据位置,数据名称)的div结构。 我想根据代码中定义的位置和名称复选框过滤显示的div。 就像我从位置复选框中检查某个位置一样,它应该仅显示那些位置div。与名称复选框相同。但是当我同时选择名称和位置时,则应将两者进行比较,并向我显示将两者结合的div。
3回复

使用点击功能检查多个div中的数据属性值

我正在尝试获取一组选定的div,以根据buttons data属性中的数据集更改背景色。 我做了一些挖掘,但是对于如何将条件传递给div中的标题以及按钮中data属性中的数据感到困惑。 我知道我可能必须.split()按钮中的数据,因为每个按钮有多个数据属性。 但是,然后获取该信息并再
1回复

div的数据属性之间存在空格时,产品过滤无法正确进行

我在网上搜索了一些有关使用div进行数据过滤的产品代码。我有两个数据属性,现在一个属性是brand(品牌),第二个属性是store。我在根据brand and store复选框选择的基础上对记录进行过滤。与给定的代码如下 过滤正常工作,但是当我在复选框ID之间的字符串中或div的数据属性中引
2回复

根据用户在下拉菜单中的选择是否匹配公司数据属性来过滤/隐藏div

目的 当用户从公司大小.select__size或行业类型.select__industry下拉列表中选择一个选项时,如果下拉列表的值与公司的数据属性data-size或data-industry不匹配,则从排行榜中隐藏任何公司.leaderboard__company 。 预期行为
1回复

单击按钮后如何将具有多个类的数据属性值输入到div?

我要实现的目标是根据数据属性,根据用户做出的选择,在段落标签中添加文本值。 但是,数据属性在同一类中,并且总共有12个此类。 如何区分单击按钮时的多个值? Codepen: https ://codepen.io/aahlfeeyann/pen/dzejOg
1回复

如何使用javascript在点击时按数据属性对div进行排序?[重复]

这个问题已经在这里有了答案: Javascript / jQuery:根据数据属性值对div重新排序[重复] 3个答案 我有多个div,我希望能够通过单击时的下拉列表样式按各种数据属性进行排序。 (请将所有的绒毛打扰。div是“ element-1”,容器是“ board-c
2回复

jQuery通过两个选择输入按数据属性进行过滤

我无法通过两个不同的输入来过滤jQuery的结果div。 用户可以决定按办公室 , 专业或同时按办公室和专业进行筛选。 过滤是根据div上与选择输入值相对应的数据属性设置的。 这是我使用的jQuery,它在选择更改时触发: 如果有帮助,我将制作一个Codepen来演示我正在尝试做的事
6回复

使用jQuery获取数据属性

<img />元素具有我想使用jQuery检索的data-id属性。 我相信.data()函数可以做到这一点。 问题:当我尝试使用.data('id')检索属性时,出现错误: 我哪里做错了? jsfiddle: http : //jsfiddle.net/KLG3R/