Сфера проблемы с последовательностью исчезновения - PullRequest
Новая
       13

Сфера проблемы с последовательностью исчезновения

2 голосов
/ 15 апреля 2011

В следующем коде у меня есть UL с x3 LI. Я хочу, чтобы LI постепенно исчезали, но я теряю область видимости где-то, я думаю. Проблема в том, что выполняется только последний элемент в последовательности. Сначала я думал, что это связано с циклом, поэтому я удалил их все. Любая помощь будет великолепна.

Спасибо заранее. 

function Sequence() {
    var sequence = [];
    var pos = 0;

    Sequence.prototype.add = function(obj) {
        sequence.push(obj);
    };

    Sequence.prototype.start = function() {
        sequence[pos].run();
    };

    Sequence.prototype.next = function() {
        pos++;
        sequence[pos].run();
    }; 
};

function fadeIn(params) {
    this.id = params.id;
    this.onComplete = params.onComplete;

    var self = this;
    var timer;
    var i = params.opacity;

    fadeIn.prototype.run = function(){
        timer = setInterval(function() {
            params.element.style.opacity = i / 10;
            i++;

            if (i / 10 == 1) {
                clearInterval(timer);
                self.onComplete();
            }
        }, params.fps);
    }
};

var sequence = new Sequence();
var fader = document.getElementById('fader1');
var items = fader.getElementsByTagName("li");

sequence.add(new fadeIn({
    "id": "instance_0",
    "element": items[0],
    "opacity": 0,
    "fps": 80,
    "onComplete": function() {
        sequence.next();
    }
}));

sequence.add(new fadeIn({
    "id": "instance_1",
    "element": items[1],
    "opacity": 0,
    "fps": 80,
    "onComplete": function() {
        sequence.next();
    }
}));

sequence.start();

1 Ответ

1 голос
/ 15 апреля 2011

Да, это проблема объема.Проблема в строке: 

fadeIn.prototype.run = function(){

Когда вы определяете метод для prototype, вы определяете метод для всех экземпляров класса fadeIn.Поэтому каждый раз, когда вы вызываете конструктор, вы переопределяете метод с помощью нового params в замыкании.

Решение состоит в том, чтобы определить метод на this (или, как вы его переименовали,, self), который является новым экземпляром, а не классом: 

self.run = function(){

Рабочий пример здесь: http://jsfiddle.net/nrabinowitz/wrQMa/3/

...