fabric.js的textbox怎么限制它只能输入数字

可以通过绑定`keydown`事件来实现限制输入数字。具体实现如下：

// 获取到要限制输入数字的textbox对象
var textbox = new fabric.Textbox('0', {
  left: 100,
  top: 100,
  width: 100,
  height: 50,
});

// 绑定keydown事件
textbox.on('keydown', function(e) {
  // 获取输入的键值
  var key = e.keyCode || e.charCode;
  // 如果不是数字键或者小数点键，则阻止输入
  if ((key < 48 || key > 57) && key !== 46) {
    e.preventDefault();
  }
});

在上面的代码中，我们首先获取到了要限制输入数字的`textbox`对象，然后通过`on`方法绑定了`keydown`事件。在`keydown`事件处理函数中，我们通过`e.keyCode`或者`e.charCode`获取到了输入的键值，如果输入的不是数字键或者小数点键，就通过`e.preventDefault()`方法阻止输入。这样就实现了限制输入数字的功能。

相关问题

fabric.js的textbox无法绑定keydown吗

可以使用`fabric.util.addListener`方法监听`keydown`事件，然后在事件处理程序中修改`textbox`的文本。以下是示例代码：

var canvas = new fabric.Canvas('canvas');

var textbox = new fabric.Textbox('Type here', {
  left: 50,
  top: 50,
  width: 150,
  fontSize: 20,
  fill: 'black'
});

canvas.add(textbox);

fabric.util.addListener(document, 'keydown', function(e) {
  if (textbox === canvas.getActiveObject() && e.keyCode === 8) {
    // 如果当前选中的对象是textbox，且按下的是退格键
    var text = textbox.text.slice(0, -1); // 获取textbox的文本并去掉最后一个字符
    textbox.set('text', text); // 修改textbox的文本
    canvas.renderAll(); // 重新渲染画布
  }
});

在上面的示例中，我们监听了整个文档的`keydown`事件，并在事件处理程序中判断当前选中的对象是否为`textbox`以及按下的是否是退格键。如果满足条件，就获取`textbox`的文本并去掉最后一个字符，然后使用`set`方法修改`textbox`的文本，并调用`renderAll`方法重新渲染画布。

fabric.js的textbox怎么监听正在编辑中的事件

在 `fabric.js` 中，`Textbox` 组件有一个 `isEditing` 属性，表示当前是否正在进行编辑。可以通过监听 `editing:exited` 和 `editing:entered` 事件来监听编辑状态的改变。具体代码如下：

var textbox = new fabric.Textbox('Edit me', {
  left: 50,
  top: 50,
  width: 200,
  fontSize: 20
});

textbox.on('editing:entered', function() {
  console.log('Entered editing mode');
});

textbox.on('editing:exited', function() {
  console.log('Exited editing mode');
});

当进入编辑状态时，会触发 `editing:entered` 事件，当退出编辑状态时，会触发 `editing:exited` 事件。你可以在事件处理程序中执行相应的操作。