数据目标不适用于我的js

时间:2017-08-03 22:02:32

标签: javascript html

我一直试图让我的投资组合项目的过滤器整晚都工作,但我似乎无法获得与javascript对应的代码? - 我出错的任何想法 - 这里是我的代码的一些片段。提前谢谢。

HTML按钮

<div class="pull-right">
            <button class="btn btn-small btn-primary" data-toggle="portfilter" data-target="all">
                All
            </button>
            <button class="btn btn-small btn-primary" data-toggle="portfilter" data-target="art">
                Art
            </button>
            <button class="btn btn-small btn-primary" data-toggle="portfilter" data-target="media">
                Media
            </button>
            <button class="btn btn-small btn-primary" data-toggle="portfilter" data-target="brand">
                Brand
            </button>
        </div>

HTML Portfolio项目

<div class="col-md-4 col-sm-6 portfolio-item" data-tag='brand'>

                <a href="#portfolioModal2" class="portfolio-link" data-toggle="modal">
                    <div class="portfolio-hover">
                        <div class="portfolio-hover-content">
                            <i class="fa fa-plus fa-3x"></i>
                        </div>
                    </div>
                    <img src="img/portfolio/homepage.jpg" class="img-responsive" alt="">
                </a>
                <div class="portfolio-caption">
                    <h4>BAU Designs</h4>
                    <p class="text-muted">Web</p>
                </div>
            </div>
            </div>

JS

function(d) {
var c = "portfilter";
var b = function(e) {
    this.$element = d(e);
    this.stuff = d("[data-tag]");
    this.target = this.$element.data("target") || ""
};
b.prototype.filter = function(g) {
    var e = [],
        f = this.target;
    this.stuff.fadeOut("fast").promise().done(function() {
        d(this).each(function() {
            if (d(this).data("tag") == f || f == "all") {
                e.push(this)
            }
        });
        d(e).show()
    })
};
var a = d.fn[c];
d.fn[c] = function(e) {
    return this.each(function() {
        var g = d(this),
            f = g.data(c);
        if (!f) {
            g.data(c, (f = new b(this)))
        }
        if (e == "filter") {
            f.filter()
        }
    })
};
d.fn[c].defaults = {};
d.fn[c].Constructor = b;
d.fn[c].noConflict = function() {
    d.fn[c] = a;
    return this
};
d(document).on("click.portfilter.data-api", "[data-toggle^=portfilter]", function(f) {
    d(this).portfilter("filter")
})

}(window.jQuery);

0 个答案:

没有答案