Question

我找不到问题。也许你可以帮助我：

load_images: function(config, container, page) {

   console.log(page) // Every time page = 4 Why?
   var paging = new Element('div','class':'pg'}).inject(container,'after'),     
       css_class = '';

   if (data.pages>1) {
     for (var i=1; i<=data.pages; i++) {                        
        css_class   = (i == page) ? 'current' : '';

        new Element('a', {'class':css_class,'href':'javascript:void(0);','html': i,
           events: { 
               click: function(e){
                  load_images(config, container, parseInt(i));
              }
           }
        }).inject(paging);
     }
   }
}

The code above generate HTML:

<div class="pg">
   <a class="current" href="javascript:void(0);">1</a>
   <a class="" href="javascript:void(0);">2</a>
   <a class="" href="javascript:void(0);">3</a>
</div>

当我点击页面链接时，我的页面变量是4（参见console.log（））。为什么？感谢。

Answer 1

这是Javascript Closure

的经典案例

问题是在你的情况下click事件创建闭包并关闭循环中的i var，所以最后它等于i的最后一个值：你可以做些什么来解决它在“for”循环中是这样的：

for (var i=1; i<=data.pages; i++) {                        
        css_class   = (i == page) ? 'current' : '';

        (function(i){
          new Element('a', {'class':css_class,'href':'javascript:void(0);','html': i,
            events: { 
               click: function(e){
                  load_images(config, container, parseInt(i));
              }
           }
         }).inject(paging);
       })(i);
     }

通过这种方式，您可以复制i并将其发送到匿名函数，并始终“保持”其值。

要完全理解它 - 阅读我发送的链接 - 这个主题在javascript中有点累积

MooTools的。循环中事件的新元素

1 个答案: