在$ .proxy函数中获取.each函数的目标

时间:2014-07-31 15:23:12

标签: javascript jquery

我使用RequireJS来构建我的JS,这就是我使用$ .proxy函数的原因。我在.each函数中尝试做的是给页面上的每个轮播一个唯一的数据属性。为了做到这一点,我必须能够定位每个轮播,但在这种情况下$(this)并不针对每个轮播。我尝试过使用currentTarget,但我认为这只适用于点击事件?

以下是需要修复的特定代码段。

        getCarousels: function() {
            $carousel.each($.proxy(function(index) {
                $owl = (index.currentTarget);
                $owl.attr('data-number', index);
                this.initCarousel();
            },this));
        },

这是完整档案。

define(['owlcarousel'], function() {

    var $ = jQuery,
        $carousel = $('.carousel'),
        $data = $('.carousel-data');

        function updateResult(pos, value, carouselNumber) {
            $(carouselNumber).find(pos).text(value);
        }

        function afterAction(el) {
            var owl = el.data('owlCarousel'),
                actualValue = this.owl.currentItem + 1,
                carouselNumber =  el.attr('data-number');

                console.log(carouselNumber);

            updateResult('.carousel-current', actualValue, carouselNumber);
            updateResult('.carousel-items', this.owl.owlItems.length, carouselNumber);
        }

    return {

        init: function() {
            if($carousel.length >= 1) {
                this.setUp();
            } else {
                return false;
            }
        },

        setUp: function() {
            this.getCarousels();
        },

        getCarousels: function() {
            $carousel.each($.proxy(function(index) {
                $owl = (index.currentTarget);
                $owl.attr('data-number', index);
                this.initCarousel();
            },this));
        },

        initCarousel: function() {
            $carousel.owlCarousel({
                singleItem: true,
                autoPlay: true,
                slideSpeed: 400,
                paginationSpeed: 800,
                lazyLoad: true,
                afterAction: afterAction
            }); 
        }

    };

});

1 个答案:

答案 0 :(得分:4)

.each接收2个参数,即索引和值。通常,该值与this相同,但是,您已将其覆盖。获取第二个参数! :

$carousel.each($.proxy(function(index, el) {
            $owl = $(el);
            $owl.attr('data-number', index);
            this.initCarousel();
        },this));

但为什么不简单地不使用代理?

var that = this
$carousel.each(function(index) {
            $owl = $(this);
            $owl.attr('data-number', index);
            that.initCarousel();
        });