在casper.evaluate()中使用casper函数

Question

可以在casper.evaluate()中使用casper函数，里面有jquery代码吗？我需要以类似于jquery的方式迭代元素。

我正在加载jquery.js库

这是我的try脚本：

casper.evaluate(function(){
    $('#size-modal .size-panel-title a').each(function(){
        $(this).click();    
        accordionTab = $(this).attr('href');
        casper.capture(screenShotOutput + "PDP-" + accordionTab +".png");
    });
});

在这个页面上有2个手风琴，我想为每个打开的手风琴截图。它似乎可以工作，但是没有给出任何反馈，并且它在第一次capture()迭代时退出了evaluate()。测试没有截图就通过了。

如果我在evaluate()之后添加

casper.capture(screenShotOutput + "PDP-accordion.png");

并对evaluate()中的capture()进行注释，我可以看到前面的代码运行良好，屏幕截图已经制作好，并且每个手风琴都是打开的。

问题是casper使用javascript选择器，所以如果我只指定

casper.click('#size-modal .size-panel-title a');
casper.capture(screenShotOutput + "PDP-" + accordionTab +".png");

如果不使用casper.evaluate()，只会打开一个手风琴。

谢谢

Answer 1

无论您在"casper.evaluate“中做什么，都类似于以这种方式在browser.Think的控制台中编写相同的代码，您就会知道自己犯了什么错误。

1. "casper.capture“是casper特定的语法，没有浏览器能理解它。

这也是来自文档的引用

在发现CasperJS时，

这个方法背后的概念可能是最难理解的。作为提醒，请考虑

evaluate()方法作为CasperJS环境和您打开的页面之间的门户；

每次将闭包传递给evaluate()时，都会进入页面并执行代码，就像使用浏览器控制台一样。

我希望这张图片能有所帮助：

​

​

我同意@Artjom B.的建议。

Answer 2

casper.evaluate()是沙箱页面上下文。它不能访问casper或外部定义的其他变量。

有两种可能性可以解决这个问题。

将循环移出页面上下文

var a = '#size-modal .size-panel-title a';
var len = casper.getElementsInfo(a).length;
for(var i = 0; i < len; i++) {
    casper.evaluate(function(i, a){
        var el = $($(a)[i]);
        el.click();    
        return el.attr('href');
    }, i, a);
    casper.capture(screenShotOutput + "PDP-" + accordionTab +".png");
}

从页面上下文中捕获触发器

有一个PhantomJS函数callPhantom，它可以从页面上下文触发外部事件：

casper.page.onCallback = function(data){
    casper.capture(screenShotOutput + "PDP-" + data +".png");
};
casper.evaluate(function(){
    $('#size-modal .size-panel-title a').each(function(){
        $(this).click();
        window.callPhantom($(this).attr('href'));
    });
});