Javascript 函数在内部调用时不起作用；addEventListener"；

我想在网页上做一个幻灯片

我创建了“下一个”和“上一个”按钮，用于以不同的方式更改图像。“下一步”按钮工作，但“上一步”按钮不工作。默认情况下，图像的“显示”属性设置为“无”

var nextbutton=document.querySelector（“.next”）；
var prevbutton=document.querySelector（“.prev”）；
var slide=document.querySelectorAll（'.slideshow'）；
var slideindex=1；
变量显示=函数（n）{
var i；
如果（n>slide.length）{slideindex=1}；
如果（n<1）{slideindex=slide.length}；
对于（i=0；i
。幻灯片放映{
宽度：100%；
高度：500px！重要；
边界半径：7px；
显示：无；
}

❮
❯

这会在绑定事件时立即调用函数，而不是在触发事件时。在绑定next button事件时可以避免此错误

改为：

prevbutton.addEventListener("click", evt => cl(-1));

或

你也可以这样做：

prevbutton.addEventListener("click", cl.bind(null, -1));




为什么你的一个不工作？
相当于：

let theReturnValue = cl(-1);
prevbutton.addEventListener("click", theReturnValue);

prevbutton.addEventListener("click", function(...args) {
  cl.call(null, -1, ...args);
});

JavaScript调用
cl（-1）
并将返回值传递给
addEventListener




为什么这个解决方案有效
您可以查找所使用的解决方案，但其等效于：

let theReturnValue = cl(-1);
prevbutton.addEventListener("click", theReturnValue);

prevbutton.addEventListener("click", function(...args) {
  cl.call(null, -1, ...args);
});




详细装订
参数：
fn.bind（thisArg[，…args]）

fn
功能

蓟马
函数
fn
（在这种情况下为
cl
）中此
的值是多少

…args
可选。函数的预定义参数。调用中给出的所有其他参数将放在这些参数之后。
prevbutton.addEventListener（“单击”，cl（-1））
将立即执行
cl
，它不会将其设置为回调或修复
cl
-似乎是为了将其设置为高阶函数。
prevbutton.addEventListener("click", function(...args) {
  cl.call(null, -1, ...args);
});