eventListener出现JavaScript错误

JavaScript error with eventListener

本文关键字：错误 JavaScript 出现 eventListener      更新时间：2023-09-26

我遇到了一个错误，我不太确定该怎么办。无论如何，在我继续之前，我发现了Unobtrusive JavaScript，起初我只是想在HTML中添加一个"OnClick"，但后来发现这不是一件很好的事情。

不管怎样，所以我做了这件事，并得到了这个代码，它还没有完全完成，但我想在进去做任何其他更改之前尝试一下。

    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");
    }
}

chrome控制台给我的错误是：Uncaught TypeError: undefined is not a functionfindInputs.js:5 findSubmitButton

还有一件事我想知道，我想能够将这个脚本与任何其他类型的输入表单一起使用，所以我没有直接识别这个页面的按钮，而是使用了一个类标识符，这样，它可以与任何页面一起使用。唯一会出现问题的方法是，如果我有两个这样的按钮，就像现在一样，任何有这类信息的页面都只有一个按钮用于此类程序。如果有人帮我解决这个问题，我将不胜感激，我是JavaScript的新手。

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

相关文章：