简体   繁体   English

Fabric.js支持文本更改事件

[英]Text changed event supported in Fabric.js

I'm currently using the latest version of Fabric.js which is 1.4.0. 我目前正在使用最新版本的Fabric.js,它是1.4.0。 Text editing is now possible using Itext object. 现在可以使用Itext对象进行文本编辑。 I'd like to execute something whenever an IText object is edited. 我想在编辑IText对象时执行某些操作。 So far I have found the modified and moving events but they do not work the same way as I want them to. 到目前为止,我已经找到了modifiedmoving事件,但它们的工作方式与我希望的不同。

canvas.on('object:modified', function(e) {
  //do something, maybe count the number of characters
});

They only work when the object is moved. 它们仅在移动对象时起作用。 Is there anyway we can execute something whenever Itext's text changes? 无论如何我们可以在Itext的文本发生变化时执行某些操作吗? That is... using the new feature available in 1.4.0, which is the direct text editing. 那就是......使用1.4.0中提供的新功能,即直接文本编辑。 Thank you very much. 非常感谢你。

Try this for text changed events for IText changes: 对于IText更改的文本更改事件,请尝试此操作:

canvas.on('text:changed', function(e) {
    console.log('text:changed', e.target, e);
});

Or this for IText object changes: 或者这对IText对象的更改:

object.on('changed', function(e) {
    console.log('changed', object, e);
});

To anyone looking for an answer to this, adding more information to Xenyal's answer, I've found out that the latest release build of fabric.js does not support text:changed under canvas. 对于那些寻找答案的人,在Xenyal的答案中添加更多信息,我发现fabric.js的最新版本不支持text:changed在canvas下text:changed

Using(Latest Release Build) http://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.4.0/fabric.min.js 使用(最新版本构建) http://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.4.0/fabric.min.js

whatevertext.on("text:changed", function(e) {
    //this works with the latest release build where whatevertext is the name of the object
});

Using(Dev Build) https://rawgit.com/kangax/fabric.js/master/dist/fabric.js 使用(开发构建) https://rawgit.com/kangax/fabric.js/master/dist/fabric.js

canvas.on('text:changed', function(e) {
    //this will only work using the dev build
});

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM