在不触发事件的情况下调用Javascript addEventListener函数

我可能忽略了一些显而易见的事情，但这似乎并不正确

我有一个小代码块，其中一个

addEventListener

方法应该触发一个函数，同时传递一个参数，这样我就可以使用不同的函数，同时用一个循环创建所有

eventlistener

。 它确实可以工作，但当站点完成加载时，会立即调用该函数

为什么函数不等待触发，而是立即运行

var html = document.getElementsByTagName('html');
var pics = document.getElementsByClassName('pics');
var functions = [];

for(h=0;h<pics.length;h++){
    array[h] = show(h);
}

for(p=0;p<pics.length;p++){
    pics[p].addEventListener('click',array[p]);
}

function show(index){
    html[0].style.backgroundColor = "black";
}

var html=document.getElementsByTagName（'html'）；
var pics=document.getElementsByClassName（'pics'）；
var函数=[]；
对于脚本中的（h=0；h）

for (h = 0; h < pics.length; h++) {
    array[h] = show(h);
  }

您可以将两个for循环缩短为一个for循环

  for (p = 0; p < pics.length; p++) {
    pics[p].addEventListener('click', show.bind(this,p));
  }

for（p=0；p

注:

脚本中应包含
回调
，而不是
函数调用

for (h = 0; h < pics.length; h++) {
    array[h] = show(h);
  }

您可以将两个for循环缩短为一个for循环

  for (p = 0; p < pics.length; p++) {
    pics[p].addEventListener('click', show.bind(this,p));
  }

for（p=0；p

注:

预期
回调
而不是
函数调用
数组[h]=show（h）；
在页面加载时被调用。下面是工作代码

var html = document.getElementsByTagName('html');
var pics = document.getElementsByClassName('pics');
var functions = [];
var array = [];

for(h=0;h<pics.length;h++){
  array[h] = function () { show(h) };
}

for(p=0;p<pics.length;p++){
  pics[p].addEventListener('click',array[p]);
}

function show(index){
  html[0].style.backgroundColor = "black";
}

var html=document.getElementsByTagName（'html'）；
var pics=document.getElementsByClassName（'pics'）；
var函数=[]；
var数组=[]；
for（h=0；h
array[h]=show（h）；
在页面加载时被调用。下面是工作代码

var html = document.getElementsByTagName('html');
var pics = document.getElementsByClassName('pics');
var functions = [];
var array = [];

for(h=0;h<pics.length;h++){
  array[h] = function () { show(h) };
}

for(p=0;p<pics.length;p++){
  pics[p].addEventListener('click',array[p]);
}

function show(index){
  html[0].style.backgroundColor = "black";
}

var html=document.getElementsByTagName（'html'）；
var pics=document.getElementsByClassName（'pics'）；
var函数=[]；
var数组=[]；
对于（h=0；h
array[h]=show（h）；
执行
show（h）
并将返回值存储在
array[h]=show（h）；
执行
show（h）
并将返回值存储在
array[h]
它能工作，谢谢你的帮助！你能用简单的话向我解释一下.bind方法吗？我不太明白它是如何工作的，即使在网上研究过它。greetz！它能工作，谢谢你的帮助！你能用简单的话向我解释一下.bind方法吗？即使在网上研究过它，我也不太明白它是如何工作的。g里兹！