Question

我使用fabric.js开发了一个程序，其中包含一些canvas和textEdit。

问题是我有一个键盘事件监听器，当我在iTextBox中输入一个字母时，如果它与监听器中处理的字母一致，它也会触发该事件。

关于如何防止这种情况的任何想法？

编辑：添加一段我正在使用的代码。

$( "body" ).keydown(function(e) {
    keyboardEvents(e);
});

function keyboardEvents(e){
    //Necesario para todo lo que no sea Chrome
    keyCode = (window.Event) ? e.which : e.keyCode;

    //Pulsar "a" para crear una curva con linea nueva.
    if(keyCode == 65){
        /* Random Function*/
    }
}

function createNewTextBoxWithIndex(index){
    textBox[closedCurvesIndex-1] = new fabric.IText("Patrón "+index, {
        top: closedCurves[index-1][3]+30,
        left: closedCurves[index-1][2],
        width: 600,
        height: 600,
        backgroundColor: '#FFFFFF',
        fill: '#000000',
        fontSize: 18,
        lockScalingX: true,
        lockScalingY: true,
        hasRotatingPoint: false,
        transparentCorners: false,
        cornerSize: 7,
        value: index  
    });

    canvas[0].add(textBox[index-1]);
}

createNewTextBoxWithIndex(1);

Answer 1

您可以实际检查事件的来源，然后进行设计。我没有iTextBox，但猜测下面的方法将是类似的。

在这个片段中我创建了两个input type =text，但我只是在它的来源不是来自第二个输入时才听到键盘事件

HTML

<input type ="text" id="firstIp">
<input type ="text" id = "secondIp">

JS

$('body').on('keydown',function(event){
 var getEvtTarget = event.target.id;
 if(getEvtTarget !== "firstIp"){
   keyboardEvents(event)
 }

})
function keyboardEvents(event){
alert(event.keyCode)

}

JSFIDDLE

您还可以检查事件是否来自iTextBox，如果是，则不要调用keyboardEvents函数。

希望这会有所帮助

在fabric.js中编辑iTextBox时防止事件发生

1 个答案: