J'essaie d'ajouter un auditeur d'événement à une toile HTM5 qui est gérée par KineticJs (la toile a été créée via une étape de kineticjs).
J'ai essayé (en utilisant jQuery):
$ ( sélecteur ). Clé (Fonction (E) {...})
avec les sélecteurs suivants:
seulement $ (fenêtre) fonctionne. Après avoir expérimenté la plaine HTML5-Toile, j'ai compris que l'élément de canvas a une prise en charge intégrée aux événements de clavier.
Je pense donc que Kineticjs fait quelque chose de magie ici. Le mauvais sélecteur peut être exclu.
J'ai vérifié tous les sélecteurs avec ce code: console.log ($ (sélecteur) .length)
Quelqu'un peut-il aider ici? Thx à l'avance!
6 Réponses :
Vous devrez vous assurer que l'élément de canvas a l'accent avant de pouvoir accepter des événements de clavier. Point nuit, la méthode .FOCUS () n'a pas fonctionné pour moi dans Firefox, alors j'ai essayé cela et voici Cliquez sur la toile et il aura la mise au point. >
Dans une application HTML5 unie, votre réponse est correcte. Mais dans une toile gérée par Kineticjs, elle ne fonctionnera pas aussi.
Si vous pouvez inclure JavaScript, voici le code:
if(keyIsPressed && keycode == somenumber){
doSomething();
}
C'est la seule réponse légère réelle
de l'expérience limitée que j'ai avec ceci (2 jours), j'ai vu que chaque couche que vous ajoutez devient une toile, de sorte que si vous avez une référence à la couche la plus haute dans une variable (c.-à-d. avec cela en place, que @ devnull69 suggéré simplement Fonctionne: Je l'ai en place dans ma demande et fonctionne bien. Top Plustlayer ), vous pouvez faire
Je suggère d'utiliser l'un des plugins clavier là-bas:
Ils fonctionnent bien avec KineticJs.
voir lien , vous avez besoin:
var canvas=layer.getCanvas()._canvas;
$(canvas).attr('tabindex', 0); // increase tabindex if needed
canvas.focus();
$(canvas).keydown(function (e) {
console.log(e.keyCode); // your handler here
});
Avez-vous trouvé une solution à votre question maintenant?