js实现点击切换图片（用js实现一个页面可以用键盘左右方向键控制两张图片切换）
本文目录
用js实现一个页面可以用键盘左右方向键控制两张图片切换
用js的 event.keyCode来获取方向键。
从网上你可以查到左右方向键对应的keyCode值，这样你就能获取到左右键点击事件了。
然后当左右键点击的时候，触发显示和隐藏对应图片的功能。
图片的显示和隐藏，你可以用js给对应的图片添加显示或者隐藏的css。
这样就能实现你要的效果了
js如何实现鼠标点击换图片
《div onclick=’change()’ id=’abc’》《/div》
《script》
function change(){
if(localStorage.a==null){
localStorage.a=0;
}
if(localStorage.a==5){//最多显示4张图片
localStorage.a=0;//自动归零
}
document.getElementById(“abc“).innerHTML=“《img src=’./“+localStorage.a+“.jpg’》“;
a=localStorage.a;
localStorage.a=parseInt(a)+1;//更换图片
}
setInterval(“change()“,秒*1000);//自动更换图片，可有可无
《/script》
javascript 点击事件实现图片切换
//《span class=“m_23 imgWrap“》《a href=“#“》《img src=“./images/heart.png“ alt=““/》《/a》《/span》
//《span class=“m_23 imgWrap“》《a href=“#“》《img src=“./images/heart.png“ alt=““/》《/a》《/span》
var imgWrap = $(’.imgWrap’);
imgWrap.on(’click’, function () {
var that = $(this);
that.hide().siblings(’.imgWrap’).show();
});
如何通过js点击两张图片来回切换
首先
if (oImg.src=“img/1.png“)
是赋值而不是判断相等, 判断相等请用==或者===
其次, 你的切换不应当依赖於从元素上读到的src, 而应当用变量维护当前的状态
示例
window.onload = function(){
var
oImg = document.getElementById(’img1’),
Picture = [’img/1.png’,’img/2.png’],
Index = 0;
oImg.onclick = function()
{
++Index
Index 《 Picture.length || (Index = 0)
oImg.src = Picture[Index]
}
}
更多文章：
2026年10月11日 08:10
易语言网页api接口怎么调用（易语言，怎么读取网页json的api）
2026年10月11日 08:00
majority of（the majority of 和 a majority of的区别以及用法例句）
2026年10月11日 07:40
2026年10月11日 07:20
2026年10月11日 06:30
2026年10月11日 06:20
2026年10月11日 05:40
another time（another time和other time的区别）
2026年10月11日 05:00
2026年10月11日 04:50
2026年10月11日 03:00
