我使用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
});
}
};
});
答案 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();
});