Функция oninput не запускается после window.onload - PullRequest
Новая
       26

Функция oninput не запускается после window.onload

0 голосов
/ 12 апреля 2020

У меня есть объект с именем MYMODCLASS, который содержит весь мой модуль functions. Одна из этих функций addNumberValues(id, getId) просматривает набор числовых входов, используя метод getElementsByName, и добавляет значения, чтобы проверить, что значения меньше 100.

Когда я вызываю функцию, используя следующие обозначения: 

window.onload = document.getElementsByName('grade').oninput = MYMODCLASS.addNumberValues('info', 'grade');

Функция запускается только один раз при загрузке документа, но не снова.

Когда я вызываю его как параметр для элемента ввода, он работает последовательно: 

<input type="number" value=0 id="ind" name="grade" min="0" max="100" oninput="MYMODCLASS.addNumberValues('info', 'grade')" required>
<input type="number" value=0 id="nv" name="grade" min="0" max="100" oninput="MYMODCLASS.addNumberValues('info', 'grade')" required>

Проблема с последним вызовом заключается в том, что я должен повторить параметр oninput 30 раз. Поэтому я хочу использовать предыдущий вызов для функции `` addNumberValues. 

MYMODCLASS.addNumberValues = function (id, getId) {
    var element = document.getElementById(id);
    var el = document.getElementsByName(getId);
    var i = 0;
    el.forEach((ite) => {
        console.log(ite.value);
        if (!isNaN(parseFloat(ite.value)) && isFinite(ite.value)) {
            if (i === 0) {
                i = parseFloat(ite.value);
            } else {
                i = parseFloat(i) + parseFloat(ite.value);
            }
        }
    })
    console.log(i);
    if (i > 100 || i < 0) {
        element.className = 'lbwarn';
        element.innerText = i;
        alert("Grade exceeds 100!")
    } else {
        element.className = 'lbinfo';
        element.innerText = i;
    }
};

Edit
Поэтому после прочтения комментариев я решил создать al oop, который устанавливает функция для каждого отдельного элемента по id. Но это все еще не работает. 

window.onload = function() {
    var numel = document.getElementsByName('grade');
    numel.forEach((p) => {
         console.log(p.id);
         document.getElementById(p.id).oninput = MYMODCLASS.addNumberValues('info', 'grade');
    })
}

Как я могу заставить вызов работать последовательно, используя мой последний метод?

...