javascript - 闭包问题?
大家讲道理
大家讲道理 2017-04-10 13:09:47
0
2
402
function bibao(i){
    return function(e){
        deleteS(i);
    }
}


for(var i=0;i<freshdreamdata.length;i++){        
    document.write("<li><a href='javascript:location.reload()' onmousedown='bibao(i)'>" + freshdreamdata[i] + "</a></li>");
}

貌似闭包写的方法不对,一直不显示deleteS效果

有人说不是闭包问题?如果不用闭包,直接onmousedown='deleteS(i)'则不显示任何效果
如在for里加上_i=this.i,则只出最后一个i的数值。
还有人说要写成bibao('+i+'),汗我不懂为什么要那么写,总之好像还是没有效果

大家讲道理
大家讲道理

光阴似箭催人老,日月如移越少年。

reply all(2)
小葫芦

楼主的代码里有很多我看不懂的地方,我据姑且的认为楼主想要实现这么一个效果:

有个存储数据的数组freshdreamdata,生成一个列表,列表里的内容与freshdreamdata一一对应。当用户点击列表里的项目时就调用deleteS并将项目的号码传递给它。

一开始楼主肯定会这样写

for(var i=0;i<freshdreamdata.length;i++){        
    document.write("<li>"+
            "<a href='javascript:location.reload()' onmousedown='deleteS(i)'>"+
            freshdreamdata[i]+
            "</a>"+
        "</li>");
}

生成的html大概是这样


<li><a href='javascript:location.reload()' onmousedown='deleteS(i)'>XXX-0</a></li> <li><a href='javascript:location.reload()' onmousedown='deleteS(i)'>XXX-1</a></li> <li><a href='javascript:location.reload()' onmousedown='deleteS(i)'>XXX-2</a></li>

当楼主点击这些可爱的链接的时候,就发现没有用。这是为什么呢?因为html解析器不知道'deleteS(i)'其中的i表示什么意思。楼主应该这样写才对:

for(var i=0;i<freshdreamdata.length;i++){        
    document.write("<li>"+
            "<a href='javascript:location.reload()' onmousedown='deleteS("+i+")'>"+
            freshdreamdata[i]+
            "</a>"+
        "</li>");
}
<li><a href='javascript:location.reload()' onmousedown='deleteS(0)'>XXX-0</a></li>
<li><a href='javascript:location.reload()' onmousedown='deleteS(1)'>XXX-1</a></li>
<li><a href='javascript:location.reload()' onmousedown='deleteS(2)'>XXX-2</a></li>

以上内容均不涉及闭包。如果楼主你想要闭包的话。。也可以。我们就用创建DOM的方法来实现这个功能。

var list=document.createElement('ul');
for(var i=0;i<freshdreamdata.length;i++){
    var li=document.createElement('li');
    var link=document.createElement('a');

    link.onclick=function(){
        deleteS(i)
    }
    link.innerText=freshdreamdata[i];

    li.appendChild(link);
    list.appendChild(li);
}
document.appendChild(list);

很多新手都会这样写,看上去好像没什么问题,但当实际操作的时候就会发现传入deleteS里的i值总是一个定值,不管点击哪个链接,删除的都是最后一个。

这个时候就需要闭包了。

function bibao(i){
    return function(){
        deleteS(i);
    }
}

var list=document.createElement('ul');
for(var i=0;i<freshdreamdata.length;i++){
    var li=document.createElement('li');
    var link=document.createElement('a');

    link.onclick=bibao(i);
    link.innerText=freshdreamdata[i];

    li.appendChild(link);
    list.appendChild(li);
}

目测楼主基本功不够扎实,上面我就先告诉个结果,其中道理自己细细品味。

黄舟
  • for循环中的i,你应该希望输出到bibao的参数中去,实际上没有……当然,你可能是想引发一个闭包问题,那当我没说……
  • bibao(i)返回一个lambda,你是要执行它吗?你应该输入bibao(i)()
  • 这个例子中有一些缺失的函数,我就拿最简单的代替了。以下代码是可以拷贝到console直接运行的:
function bibao(i){
    return function(e){
        alert(i);
    }
}


for(var i=0;i<10;i++){        
    document.write("<li><a href='javascript:bibao(" + i + ")()'>" + i + "</a></li>");
}
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!