Capture Tastendruck in Javascript (Google Docs)

Question

Ich versuche, ein wenig Fettschrift Skript/Bookmarklet/was hast du für Google Docs schreiben. Die Funktionalität, die ich hinzufügen möchte, benötigt einen Keypress/Keyup/Keydown Event-Handler (einer dieser drei). Leider ist Javascript nicht meine Stärke, und ich kann nicht scheinen (?) Ein Tastendruckereignis, um im Bearbeitungsbereich zu bleiben. Als letzten Ausweg, habe ich folgendes versucht:

javascript:(function(){ 
    els = document.getElementsByTagName("*"); 
    for(i=0;i<els.length;i++){ 
    els[i].onkeypress=function(){alert("hello!");}; 
    els[i].onkeyup=function(){alert("hello2!");}; 
    els[i].onkeydown=function(){alert("hello3!");}; 
    } 
})(); 

Dies ist jedoch noch nicht erfaßt Drücken von Tasten im Editierfenster - keine lästigen Warnungen (obwohl es für die meisten anderen Websites zu funktionieren scheint ...) . Ich habe beide in Chrome und Firefox eingecheckt (ich kann es in keinem von beiden finden).

Ich versuchte "Log-Ereignisse" in Firebug (und überprüfte alle registrierten Ereignisse über eine nette kleine Erweiterung zu Firebug, Eventbug); Es schien nicht so, als würden diese Ereignisse auf Tasten drücken.

Edit:
Um zu klären [Tim], ich diese screenshot mit einigen Anmerkungen gemacht ...

Der "Editierfenster" Ich bin über ein Bündel von Javascripted-up divs scheint im Gespräch zu sein Anzeigen was ich tippe.

Irgendwelche Ideen? Vielen Dank!

Answer 1

Die Bearbeitung in Google Text & Tabellen verwendet einen iframe. Sie müssen einen Listener an das Dokument des Iframes anhängen. Es scheint etwas kompliziertes mit dem iframe zu tun, das ich noch nicht vollständig ausarbeiten konnte, aber das folgende scheint für Firefox zu funktionieren:

Answer 2

Scheint für mich zu arbeiten ... aber ich benutze jQuery $ (document) .ready(), um sicherzustellen, dass meine Seite geladen wird, bevor Sie ein Event anhängen. Ich glaube, Sie es in nackten Javascript tun könnte mit:

window.onload = function() 
{ 
    els = document.getElementsByTagName("*"); 
    for(i=0;i<els.length;i++) { 
    els[i].onkeypress=function(){alert("hello!");}; 
    } 
} 

Durch die Art und Weise Sie nicht mehr als eine Funktion zum Ereignis anhängen können:

for(i=0;i<els.length;i++){ 
    els[i].onkeypress=function(){alert("hello!");}; 
    els[i].onkeypress=function(){alert("hello2!");}; 
    els[i].onkeypress=function(){alert("hello3!");}; 
} 

Das Element wird registrieren nur die letzte (es überschreibt die vorherige Funktion), in diesem Fall "alert (" hallo3! ");"

Answer 3

Sie müssen den Listener nicht an alle Elemente auf der Seite anhängen. Es genügt, es an das Dokument anzuhängen.

window.addEventListener('load', function() { 
    document.addEventListener('keypress', function() { alert("hello!"); }); 
} 

Da es ein Greasemonkey-Skript Sie müssen nicht über IE kümmern und die addEventListener Methode verwenden können.