Ошибка JavaScript с eventListener

Question

Я получаю сообщение об ошибке, которое я не совсем уверен, что делать. Во всяком случае, прежде чем я перейду к этому, я узнал о ненавязчивом JavaScript, сначала я просто собирался добавить «OnClick» в свой HTML, но потом выяснил, что это не очень хорошо.

Во всяком случае, я сделал это и включил этот код, который еще не совсем закончен, но я все же хотел попробовать его, прежде чем я войду и внес любые другие изменения.

window.onload = function findSubmitButton(){ 
    var button = document.getElementsByClass("send_info").addEventListener("click", retrieveInputText()); 
} 

function retrieveInputText(){ 
    var inputArray = document.querySelectorAll("#container_id input[type=text]"); 
    var finalArray; 
    for (var i in inputArray){ 
     if(inputArray[i].type == "text"){ 
      finalArray.push(i); 
     } 
    alert("done"); 
    } 
} 

консоль хромированной об ошибке дает мне это: Uncaught TypeError: undefined is not a functionfindInputs.js:5 findSubmitButton

Было также то, что я хотел бы знать, я хочу, чтобы иметь возможность использовать этот сценарий с любым другим видом формы входного сигнала, так что вместо напрямую определяя кнопку для этой страницы, я использовал идентификатор класса, таким образом, он работает с любой страницей. Единственным способом было бы возникнуть проблемы, если бы у меня было две кнопки такого типа, как сейчас, на любой странице с такой информацией есть только одна кнопка для таких процедур. Я был бы признателен, если бы кто-то помог мне с этим, я новичок в JavaScript.

Answer 1

getElementsByClassName() возвращает массив не элемент, поэтому он не имеет метод addEventListener, также необходимо передать Ссылка на функцию

window.onload = function findSubmitButton() { 
    var button = document.getElementsByClassName("send_info")[0].addEventListener("click", retrieveInputText); 
} 

Кроме того, необходимо инициализировать массив var finalArray = [];

---

window.onload = function findSubmitButton() { 
    var button = document.querySelector(".send_info").addEventListener("click", retrieveInputText); 
} 

function retrieveInputText() { 
    var inputArray = document.querySelectorAll("#container_id input[type=text]"); 
    var finalArray = []; 
    for (var i in inputArray) { 
     if (inputArray[i].type == "text") { 
      finalArray.push(i); 
     } 
    } 
    alert("done:" + finalArray); 
} 

Демо: Fiddle