javascript - for循环中的点击事件| i 值始终是最后一个值

Question

我是 CasperJS 初学者。

我想循环遍历 ul 的所有 li 并单击每个 li。单击 li 时，会弹出一个模式并正在保存模式数据。但循环内“i”的值始终是最终值。
我的 ul 中有 5 个 li。
以下循环始终单击第 5 里 5 次，并在单击第 5 里时保存模态数据 5 次。

casper.then(function() {
  a = lis.length;
  this.echo(a + ' lis found');
  for(var i = 1; i <= a; i++ ) {
    this.echo(i + ' now');
    this.click('.hello:nth-child('+ i +')' );
    casper.waitUntilVisible('.modal__content ', function() {
      console.log('Open Modal');
      links = links.concat(this.evaluate(getLinks));
    });
  }
});

我用谷歌搜索发现我们应该将事件监听器的分配包装在闭包中。但这并没有反射(reflect)出任何东西。

casper.then(function() {
  a = lis.length;
  this.echo(a + ' lis found');
  for(var i = 1; i <= a; i++ ) {
    (function(i){  // Added this line
      this.echo(i + ' now');
      this.click('.hello:nth-child('+ i +')' );
      casper.waitUntilVisible('.modal__content ', function() {
        console.log('Open Modal');
        links = links.concat(this.evaluate(getLinks));
      });
    })(i); // Added this line
  }
});

Answer 1

将 click 更改为 thenClick 解决了问题:)

casper.then(function() {
  a = lis.length;
  this.echo(a + ' lis found');
  for(var i = 1; i <= a; i++ ) {
    this.echo(i + ' now');
    this.thenClick('.hello:nth-child('+ i +')' ); // Changed to thenClick from click
    casper.waitUntilVisible('.modal__content ', function() {
      console.log('Open Modal');
      links = links.concat(this.evaluate(getLinks));
    });
  }
});