如何使用PhantomJS在单个网页中发送多次点击？

Question

I'm using PhantomJS 2.1.1 to take screenshots of web pages.

What I need on this particular page is to click several times on a div element in order to slide pictures in a diaporama, by using the following code in a page.evaluate block :

page.open(url, function () {
    page.evaluate(function() { 
        for (i = 0; i < 10; i++) {
            setTimeout(function(){
                document.querySelector("div.linksNavNext.linksNav.icon-fleche-suiv").click();
            }, 500);
        }
    });       

    setTimeout(function(){
        page.render('url.png');
        phantom.exit();
    }, 2000);
});

As you see I try to get the 10th picture in the diaporama by sending 10 times the click event. But what I get is just the second picture. It seems the click event is sent only once, despite the for loop.

What am I doing wrong?

Answer 1

It seems all 10 of your clicks are executed in just 500 ms. You need to postpone timeout:

for (i = 0; i < 10; i++) {
  setTimeout(function(){
    document.querySelector("div.linksNavNext").click();
  }, 500 * i);
}