无法使用Javascript oop附加按钮的单击事件

Question

我正在将click事件附加到具有类“ nextPage”的按钮上，但它不起作用。 让我向您展示代码。

function myContent() {

}

myContent.prototype.clickNext = function() {
alert("clicked");    
};


var objMyContent = new myContent();

var el = document.getElementsByClassName('nextPage');
el.onclick=objMyContent.clickNext();

请看一下。 请让我知道我在哪里做错了。

Answer 1

分配点击处理程序时，您需要引用该函数，而不是执行它。

代替：

el.onclick = objMyContent.clickNext();

用这个：

el.onclick = objMyContent.clickNext;

第一段代码执行clickNext ，并将其返回值分配给el.onclick 。
第二行将对clickNext函数的引用分配给el.onclick 。 （这是您想要的）

另外， getElementsByClassName返回一个HTMLCollection （基本上是HTML元素的数组）。
您需要将点击处理程序分配给该集合中找到的每个元素：

for(var i = 0; i < el.length; i++){
    el[i].onclick = objMyContent.clickNext;
}

Answer 2

迭代数组并分配onclick事件

var objMyContent = new myContent();

var el = document.getElementsByClassName('nextPage'); for(var i=0;i<el.length;i++) el[i].onclick=objMyContent.clickNext;