Question

我是javascript / jQuery的新手。

我正在做一个简单的淡入淡滑滑块在页面上使用，我正试图尽可能多地放入对象内部，所以每当我创建一个新的对象实例时它就可以开箱即用。在设置导航时，我首先执行了以下操作：

testimonial = new slider($('.testimonials'), $('.testimonials-nav'));
testimonial.nav.on('click', function (e) {
testimonial.setCurrent($(this).data('dir')); // changes the current slider
testimonial.transition(); // what happens when the 'current' changes
testimonial.setHeight(); //because everything is 'position: absolute', I set the parent div height with js
e.preventDefault();
});

但是这样我每次创建滑块的新实例时都需要重复所有这些代码，所以我尝试了不同的方法，我创建了两种方法：

slider.prototype.init = function () {
    this.numberEls();
    this.setHeight();
    this.activateNav();
};

所以当我创建一个新实例时，我可以执行以下操作

testimonial = new slider($('.testimonials'), $('.testimonials-nav'));
testimonial.init();

并创建了此方法

slider.prototype.activateNav = function () {
    this.nav.on('click', function (e) {        
        this.setCurrent($(this).data('dir'));
        e.preventDefault();
    });
};

但由于事件处理程序中“this”关键字的范围，它显然不起作用，如何使“this.setCurrent”在此上下文中工作？

总的来说，另一个问题是，我正在努力实现的目标是一个好方法吗？请记住，它可能会在网站的其他部分使用，而不仅仅是在推荐书中使用。

如果问的不是太多，我怎么能让它自动循环？我知道它涉及setTimeOut（）或其他什么，但我不确切知道如何（我需要诚实地说这是一个懒惰的问题，我实际上甚至没有尝试过这样做，然后问如何，但因为我在这里= p）

Heres the fiddle

PS。我很抱歉，如果我没有说清楚，英语不是我的第一语言，我有时会挣扎= P

Answer 1

只需保存对this的引用，稍后再使用。

slider.prototype.activateNav = function () {
    var that = this;
    this.nav.on('click', function (e) {        
        that.setCurrent($(this).data('dir'));
        e.preventDefault();
    });
};

将'this'关键字传递给面向对象的Javascript上的事件

1 个答案: