zoukankan      html  css  js  c++  java
  • JavaScript闭包

    例如以下的html,为什么每次输出都是5,而不是点击每一个p。就alert出相应的1,2,3。4。5
    <span style="font-family:Microsoft YaHei;"><html >     
    <head>     
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />     
    <title>闭包演示</title>     
    <script type="text/javascript">     
        
    function init() {     
        var pAry = document.getElementsByTagName("p");     
        for( var i=0; i<pAry.length; i++ ) {     
             pAry[i].onclick = function() {     
             alert(i);     
        }     
      }     
    }     
    </script>     
    </head>     
    <body onload="init();">     
    <p>产品一</p>     
    <p>产品二</p>     
    <p>产品三</p>     
    <p>产品四</p>     
    <p>产品五</p>     
    </body>     
    </html>     </span>

    解决方案有两种。

    1、将变量 i 保存给在每一个段落对象(p)上

    <span style="font-family:Microsoft YaHei;">    function init() {   
          var pAry = document.getElementsByTagName("p");   
          for( var i=0; i<pAry.length; i++ ) {   
             pAry[i].i = i;   
             pAry[i].onclick = function() {   
                alert(this.i);   
             }   
          }   
        }   </span>

    2、将变量 i 保存在匿名函数自身 
    <span style="font-family:Microsoft YaHei;">    function init2() {   
          var pAry = document.getElementsByTagName("p");   
          for( var i=0; i<pAry.length; i++ ) {     
           (pAry[i].onclick = function() {   
                alert(arguments.callee.i);   
            }).i = i;   
          }   
        }   </span>


查看全文
  • 相关阅读:
    「NOIP 2017」列队
    java基础-略知一二
    重磅发布!阿里云推PostgreSQL 10 高可用版
    双11奇迹背后的大数据平台,不喧哗,自有声!
    深度解析双十一背后的阿里云 Redis 服务
    双11大考 POLARDB分钟级弹性让企业轻松扩展
    双十一流量洪峰 支撑阿里核心业务的云数据库揭秘
    双十一高并发场景背后的数据库RDS技术揭秘
    直击KubeCon 2018 |云原生正在改变你的衣食住行
    一文带你领略虚拟化领域顶级技术会议KVM Forum 2018
  • 原文地址:https://www.cnblogs.com/ldxsuanfa/p/10658536.html
  • Copyright © 2011-2022 走看看