2014-07-10 42 views
9

Kumaş uygulamamda, şu anda silme tuşu ve seçili öğeleri silme gibi belirli tuşa basmalarını dinliyorum. tuşa basma için dinleme Benim yöntemidir:fabric.js tuval klavye olaylarını dinle?

document.onkeydown = function(e) { 
    if (46 === e.keyCode) { 
    // 46 is Delete key 
    // do stuff to delete selected elements 
} 

olsa bir sorun haline çalıştırıyorum: Ben sayfadaki metin kutuları gibi diğer unsurları var ve bir metin kutusuna yazarken, ben istemiyorum herhangi bir öğeyi silmek için anahtarı sil.

canvas.tabIndex = 1000; 

klavye olaylarıyla canvas.addEventListener kullanmanızı sağlar:

this question yılında bir HTML5 tuval bir olay dinleyicisi eklemek için açıklanan bir yöntem var.

Buna benzer bir şeyi kumaşın tuvaliyle kullanabilir miyim? Böyle denedim

,
var CANVAS = new fabric.Canvas('elemID', {selection: false}) 
CANVAS.tabIndex = 1000; 
CANVAS.addEventListener("keydown", myfunc, false); 

alıyorum: Chrome'dan "Yakalanmayan TypeError tanımsız bir işlev değil".

cevap

12

Yaptığım şey şöyledir: Kumaş tarafından kullanılan tuvalin etrafında bir sarıcı div var ve bu sarmalayıcıya olay dinleyicisini ekledim.

var canvasWrapper = document.getElementById('canvasWrap'); 
canvasWrapper.tabIndex = 1000; 
canvasWrapper.addEventListener("keydown", myfunc, false); 

Bu tam olarak istediğim gibi çalışıyor. silme metin kutusunun içinde gerçekleşen baskılar dinleyici tarafından alınmaz.

İlgili konular