Javascript 将参数传递给onchange（）函数

我正在尝试创建一个图像滑块，在其中移动滑块上的控制柄将更改要显示的图像

在下面的代码中，我使用onchange函数动态更新图像 （id=“image”）基于滑块的当前值（id=“image slider response”）

现在，我尝试将imageGroup作为参数传递给onchange函数，以将上面的代码扩展到其他图像组。 我按照这个链接，但似乎没有工作。有什么建议可以解决这个问题吗

    var imageGroup1 = ['imageA.jpg','imageB.jpg','imageC.jpg'];
    var imageGroup2 = ['imageD.jpg','imageE.jpg','imageF.jpg'];
    var slide = document.getElementById('image-slider-response');
    var imageDiv = document.getElementById("image");

    function myFunction(x){
        return function(){
            sliderDiv.innerHTML = slide.value;
            imageDiv.src = x[slide.value];
        }
    }
    var imageGroup = imageGroup1;
    slide.addEventListener("onchange", myFunction(imageGroup));

---

回调在正确的轨道上，只有一件事-当使用

addEventListener

时，不要在事件前面加上

on

：只使用普通事件名称

slide.addEventListener("change", myFunction(imageGroup));

slide.addEventListener("change", myFunction(imageGroup));