javascript - 模拟 Canvas Fabric.js上的mousedown事件

标签 javascript canvas fabricjs

我在此处进行了基本设置,以测试是否可以在Fabric.js Canvas 上按下鼠标,并且尝试通过javascript(而不是通过鼠标单击)手动触发鼠标事件以模拟在 Canvas 上的单击。

的HTML

<canvas id="c"></canvas>
<a id="testClick" href="javascript:void(0)">Test</a>

Java脚本
var canvas = new fabric.Canvas("c");

$("#testClick").click(function() {
   var e = jQuery.Event("mousedown", {
     pageX: 700,
     pageY: 300
   });
   $('#c').trigger(e);
});

canvas.on({"mouse:down": function() {
   alert("you clicked me");
}});

到目前为止,没有什么可以让我模拟这一点的,帮助表示赞赏。

最佳答案

var canvas变量必须是jQuery定义的一部分。但是我看到它是 Fabric 的一部分。因此,.trigger()无法在该定义上使用。

.trigger()是jQuery框架,因此可以在jquery选定的element $上使用。

更新

https://jsfiddle.net/zo98p72L/14/

由于已被投票2次-我决定发布此内容。

关于javascript - 模拟 Canvas Fabric.js上的mousedown事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38820498/

相关文章:

html - Fabric.js 动态裁剪单个对象

javascript - 平均应用程序 : Can't find theme in Angular material

javascript - 从带有符号的字符串中获取数组中的下一个键

javascript - 基于 Canvas 大小的 HTML5 Canvas 字体大小

javascript - 动态添加图片源

javascript - Camanjs 与 Fabricjs - 哪一个主要用于图像编辑和操作?

javascript - Fabric.js 将文本剪切到矩形

javascript - 通过命令行更改 Grunt 配置变量

javascript - 自动写入输入

javascript - 用于圆形的 HTML5 Canvas ctx.clip() 方法在圆形下方留下一条线