如何让javascript点击灯泡,多次换颜色,求详细代码解答

刚学,真不懂,求详细的代码解答,多谢。
2024-11-14 19:43:48
推荐回答(2个)
回答1:

这个非常简单,就是根据点击事件来交替两张图片而已。如果你要拓展成变N次的,可以事先准备好相应的图片,然后写一个数组来依次变化图片src即可。

例如:点击变化“红、黄、绿、蓝”四色,事先做好4张图片:eg_blub_red.gif、eg_blub_yellow.gif、eg_blub_green.gif 和 eg_blub_blue.gif。然后JS里这样写:

var bulbColors = ['red', 'yellow', 'green', 'blue'];
var idx = 0;  // 索引
function changeImage() {
   var imgUrl = '/i/eg_blub_' + bulbColors[idx] + '.gif',
       element = document.getElementById('myimage');
   element.src = imgUrl;  // 更换图片
   idx++;
   if (idx == bulbColors.length) {
       idx = 0;
   }
}

回答2:

没问题啊