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月15日 08:10
2026年10月15日 07:30
prison break（越狱（prison break）到底是在讲个什么）
2026年10月15日 06:50
c程序设计第五版教学视频（求C程序设计（第五版）谭浩强教材源代码、视频课件等电子版资料！谢谢大家！）
2026年10月15日 06:40
2026年10月15日 06:20
十六进制转二进制表（16进制转为2进制、8进制、10进制的公式）
2026年10月15日 06:10
programdata是什么文件（win7下ProgramData 文件夹是什么，里面的内容可以删吗）
2026年10月15日 04:50
502错误的网关（“502错误网关，服务器作为网关或代理，从上游服务器收到了无效的响应”怎么处理谁能帮我）
2026年10月15日 04:10
2026年10月15日 04:00
2026年10月15日 03:40
