关于javascript数组与循环的一个小问题。
for循环遍历数组arr[]并存取3个div的offsetWidth，鼠标移入第一个div，让它的width变成arr[i]中相对应的width，程序报错：参数无效；<h...
for循环遍历数组arr[]并存取3个div的offsetWidth，鼠标移入第一个div，让它的width变成arr[i]中相对应的width，程序报错：参数无效；
<html><head><title></title>
<style type='text/css'>
#div1{width:100px;height:50px;background:red;margin:50px;}
#div2{width:200px;height:50px;background:green;margin:50px;}
#div3{width:300px;height:50px;background:blue;margin:50px;}
</style>
<script language='javascript'>
window.onload=function ()
{
var odiv1=document.getElementById('div1');
var adiv=document.getElementsByTagName('div');
var arr=[];
for (var i=0;i<adiv.length;i++)
{
arr[i]=adiv[i].offsetWidth;
arr[i].index=i;
adiv[i].onmouseover=function ()
{
this.style.width=arr[i]+'px';//问题在这，arr[i]无法正确被读取；
}
}
}
</script>
</head>
<body>
<div id='div1'>
</div>
<div id='div2'>
</div>
<div id='div3'>
</div>
</body>
</html>
求解惑 展开
<html><head><title></title>
<style type='text/css'>
#div1{width:100px;height:50px;background:red;margin:50px;}
#div2{width:200px;height:50px;background:green;margin:50px;}
#div3{width:300px;height:50px;background:blue;margin:50px;}
</style>
<script language='javascript'>
window.onload=function ()
{
var odiv1=document.getElementById('div1');
var adiv=document.getElementsByTagName('div');
var arr=[];
for (var i=0;i<adiv.length;i++)
{
arr[i]=adiv[i].offsetWidth;
arr[i].index=i;
adiv[i].onmouseover=function ()
{
this.style.width=arr[i]+'px';//问题在这，arr[i]无法正确被读取；
}
}
}
</script>
</head>
<body>
<div id='div1'>
</div>
<div id='div2'>
</div>
<div id='div3'>
</div>
</body>
</html>
求解惑 展开
4个回答
展开全部
window.onload=function ()
{
var odiv1=document.getElementById('div1');
var adiv=document.getElementsByTagName('div');
var arr=[];
for (var i=0;i<adiv.length;i++)
{
arr[i]=adiv[i].offsetWidth;
arr[i].index=i;
adiv[i].onmouseover=(function(i){
var thas = this;
return function (i)
{
// 按你的写法i始终是arr.length - 1;
thas.style.width=arr[i]+'px';
};
})(i);
}
}
追问
你的没问题 不过方法有点复杂啊
有没有简单点的
追答
这已经最简单了，只是加了个闭包而已，你可以自己封装一下，方便调用
Function.prototype.bind = function(){
var oThis = this,
args = Array.prototype.slice.call(arguments),
obj = args.shift();
return function () {
oThis.apply(obj, args);
}
};
adiv[i].onmouseover = function( index ){
thas.style.width = arr[ index ] + 'px';
}.bind(adiv[i], i);
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
arr[i].index=i;改为adiv[i].index=i;
adiv[i].onmouseover=function ()
{
this.style.width=arr[i]+'px';//问题在这，arr[i]无法正确被读取；
}
把arr[i]+'px'换成arr[this.index]+'px'
adiv[i].onmouseover=function ()
{
this.style.width=arr[i]+'px';//问题在这，arr[i]无法正确被读取；
}
把arr[i]+'px'换成arr[this.index]+'px'
追问
这个真好使
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
this.style.width=arr[i]+'px';//问题在这，arr[i]无法正确被读取；这里鼠标移进去的时候已经没有i了,所以取不到值的
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
报错了吗？木有问题啊
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（2）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
