Как остановить мой таймер, если все входы заполнены

Question

У меня есть метод с формой, сколько полей ввода там меняется.Форма имеет таймер.На входе таймер начнет работать, как я могу обнаружить, что все формы заполнены. Чтобы остановить таймер после заполнения всех входов?

self.tm.start () запускает таймер сразу после.on ('input', function ()

        inputField(i) 
    {
        let self = this;
        let textarea = self.JSON_DATA.main_object.exercises[i].textarea;

        let div = $("<div/>", {
            class: "form-group row"
        });

        let word;
        for (let a = 0; a < textarea.length; a++) 
        {
            if (textarea[a].checked == "true") 
            {
                word = $("<input/>", {
                    class: 'form-control col-2 my-1 mx-1'
                }).on('input', function(){
                    //Timer start
                   self.tm.start()
                    if ($(this).val() == textarea[a].word)
                     {
                        $(this).nextAll('input').first().focus();
                        $(this).addClass('btn-success').attr("disabled", true)
                     }});
            } else {
                word = $("<span/>", {
                    class: 'col-form-label mx-1'
                    }).html(textarea[a].word);
            }
                div.append(word);
        }
                    return div;       
    }

Timer

/**
 *  var t = new TIMER([ID]/[CLASS]);
 *  (object) target is the element on which the timer will be displayed
 */

function TIMER(target) {
    var self = this;
    self.timer = false;
    self.sec = 0;

    /**
     *  Initiates TIMER on target-element(s)
     */
    self.init = function () {
        var style = $('<style></style>').attr('type', 'text/css').html(target + ' .inline{display: inline-block}');
        $('head').append(style);
        self.sec = 0;
        $(target).html('');
        var minutes = $('<div/>', {
            id: 'minutes',
            class: 'inline'
        }).css({
            'padding-right': '6px'
        }).html(self.pad(parseInt(self.sec / 60, 10)));

        var seconds = $('<div/>', {
            id: 'seconds',
            class: 'inline'
        }).css({
            'padding-left': '6px'
        }).html(self.pad(self.sec % 60));

        $(target).append(minutes, ':', seconds).css('font-size', '2.0em');

    };

    /**
     *  (int) val
     *  Puts a leading 0 in front if val < 10
     */
    self.pad = function (val) {
        return val > 9 ? val : "0" + val;
    };

    /**
     *  Start TIMER with interval of 1000ms
     */
    self.start = function () {
        if (self.timer === false) {
            self.timer = setInterval(
                    function () {
                        $("#seconds").html(self.pad(++self.sec % 60));
                        $("#minutes").html(self.pad(parseInt(self.sec / 60, 10)));
                    },
                    1000);
        }
    };

    /**
     *  Stops TIMER
     */
    self.stop = function () {
        clearInterval(self.timer);
    };

    /**
     *  Stops TIMER and reinitiates it
     */
    self.reset = function () {
        self.stop();
        self.init();
    };

    /**
     * returns (string) with current min and sec
     */
    self.getTime = function () {
        return self.pad(parseInt(self.sec / 60, 10)) + ':' + self.pad(self.sec % 60);
    }

    self.init();
}

self.tm.stop () остановит таймер, но как мне его реализовать.

Answer 1

Хорошо, исправил мою собственную проблему.

Я сделал 2 переменные класса.Я вызываю их в конструкторе

       this.timeStop = 0;
       this.timeStop1 = 0;

Тогда это моя входная функция

    inputField(i) 
    {
        let self = this;
        let textarea = self.JSON_DATA.main_object.exercises[i].textarea;

        let div = $("<div/>", {
            class: "form-group row"
        });

      let word;
        for (let a = 0; a < textarea.length; a++) 
        {
            if (textarea[a].checked == "true") 
            {
                word = $("<input/>", {
                    class: 'form-control col-2 my-1 mx-1',
                    id:'answerField'
                }).on('input', function() {
                    self.tm.start() // Timer start
                    if ($(this).val() == textarea[a].word){
                        self.timeStop++; // COUNTING VARIABLE 1
                        $(this).nextAll('input').first().focus();
                        $(this).addClass('btn-success').attr("disabled", true);
                        self.check_answers();
                    }});
                this.timeStop1++; // COUNTING VARIABLE 2
                self.checkAnswers(); // CALLING METHOD TO SEE IF VARIABLES ARE EQUAL TO EACHOTHER
            } else {
                word = $("<span/>", {
                    class: 'col-form-label mx-1'
                    }).html(textarea[a].word);
            }
                div.append(word);
        }
                    return div;       
    }

Я считаю обе предыдущие переменные.Один в операторе if для каждого поля ввода.Другой в цикле for, но после оператора if.

Тогда у меня есть другой метод, который проверяет, равны ли они друг другу, и останавливает таймер.

    checkAnswers(){
        let self = this;

        if (this.timeStop == this.timeStop1) {    
            self.tm.stop();   
        }
    }