js图片切换问题,高手来看看

来源:百度知道 编辑:UC知道 时间:2024/05/24 17:11:35
<html>
<body onLoad="nav_ch()">
<script>
function nav_ch()
{
var x=document.getElementById("nav").getElementsByTagName("img");
var a=new Array("images/img1.jpg","images/img2.jpg","images/img3.jpg");
var b=new Array("images/img1_1.jpg","images/img2_1.jpg","images/img3_1.jpg");
for(var i=0;i<x.length;i++)
{
x[i].onmouseover=function(){
this.src=b[i]}
x[i].onmouseout=function(){
this.src=a[i]}
}
}
</script>
<div id="nav">
<img src="images/img1.jpg">
<img src="images/img2.jpg">
<img src="images/img3.jpg">
</div>
</body>
</html>

结果显示a[i],b[i]没定义,怎么回事??

<html>
<body onLoad="nav_ch()">
<script>
function nav_ch()
{
var x = document.getElementById("nav").getElementsByTagName("img");
var a = new Array("images/img1.jpg","images/img2.jpg","images/img3.jpg");
var b = new Array("images/img1_1.jpg","images/img2_1.jpg","images/img3_1.jpg");

for(var i=0;i<x.length;i++)
{
// 这样修改一下. 因为你是要动态添加
// 事件的处理函数, 这是有一个问题, 就是
// 在javascript中, 事件处理函数的内容真正
// 的执行时间是在他被触发的时候, 而这是你的
// i其实是等于循环后的最大值, 这就导致你的图片始终
// 是数组中的最后一张(我表达能力有限, 是在抱歉
// 建议你还是多看看书吧, javascript权威指南, 我
// 推荐你看一看)
x[i].mouseover_img = b[i];
x[i].onmouseover = function(){
this.src = this.mouseover_img;
}

x[i].onmouseout_img = a[i];<