javascript - 如何使用 PhantomJS (1.9.8) 将点击事件发送到 div 或按钮？

Question

我不明白如何使用 sendEvent() 关闭模式或 PhanthomJS 元素.

例如，我尝试使用下面的代码或使用 CaperJS click 和 clickLabel 以及许多其他东西来做到这一点，但它不起作用。

var webpage = require('webpage').create();
var url  = 'http://sourceforge.net/';
webpage.viewportSize = { width: 1280, height: 800 };
webpage.render("test1.png");

webpage.onLoadFinished = function(status) {
    var coords = webpage.evaluate(function() {
        var firstLink = document.querySelector('a.btn');
        return {
            x: firstLink.offsetLeft,
            y: firstLink.offsetTop
        };
    });
    console.log(coords.x);
    console.log(coords.y);
    webpage.sendEvent('mousedown', coords.x, coords.y ,'left');
};


webpage.open(url,function(){
    webpage.render("test2.png");
    phantom.exit()
});

这是我想跳过的元素。

Answer 1

offsetLeft和 offsetTop 仅给出基于父元素的偏移量。您必须将所有元素偏移量相加到根节点。这至少是 CasperJS 所做的。

如果这个通知是静态的，你可以一次确定坐标，每次都使用它们。根据屏幕截图 (444,330) 似乎可以很好地替代 coords.x, coords.y。

您也可以按照 here 所述简单地使用合成鼠标单击这就是 CasperJS 所做的，但结合了特定的位置。这是一个普通的合成点击:

function click(el){
    var ev = document.createEvent("MouseEvent");
    ev.initMouseEvent(
        "click",
        true /* bubble */, true /* cancelable */,
        window, null,
        0, 0, 0, 0, /* coordinates */
        false, false, false, false, /* modifier keys */
        0 /*left*/, null
    );
    el.dispatchEvent(ev);
}

---

此外，当页面加载时，您还有两个回调(onLoadFinished 和 webpage.open 中的函数)。你应该只有一个，所以当调用其中一个时你不会遇到问题。点击后，最好用setTimeout稍等片刻，让页面发生变化再截屏。