用CasperJS，如何使鼠标操作，以使“拖拽”的效果

With CasperJS,how to make mouse operation in order to make the effect of "dragging"?

本文关键字：拖拽 操作 CasperJS 何使 鼠标 以使      更新时间：2023-09-26

我使用"http://104.238.150.223:8888"来测试它，这是一个html，我们可以用鼠标在上面画，我的代码如下:

var casper = require('casper').create();
var mouse = require('mouse').create(casper);
casper.start('http://104.238.150.223:8888',function() {
    this.echo(this.getTitle());
});
casper.then(function() {
    this.wait(2000,function() {
        this.mouse.down(0,0);
        this.mouse.move(40,40);
        this.mouse.move(60,40);
        this.mouse.down(60,40);
    });
    this.capture('test.png');
})

但是不行，画板里什么也没有T_T

本地事件

本机拖动是不可能的PhantomJS (CasperJS是建立在它之上)，因为每个casper.mouse.*()调用实际上开始一个新的鼠标动作和"重置";前一个。在呼叫之间不保留任何鼠标按钮的按下状态。这与PhantomJS的page.sendEvent如何工作有关，它通过CasperJS(强调我的)处理所有用户操作:

第一个参数是事件类型。支持的类型是'mouseup'， 'mousedown'， 'mousemove'， '双击'和'click'。接下来的两个参数是可选的，但是代表了事件的鼠标位置。

button参数(默认为left)指定要按的按钮。

对于' mousmove '，没有按下按钮(即它没有拖动)。

合成事件

您可以尝试使用casper.evaluate内部可用的DOM api触发合成事件。你需要

  • 查找页面上实际负责捕获这些UI事件的元素和

  • 在该元素上触发相应的事件:1 x mousedown, n x mousemove和1 x mouseup。

相关文章：