javascript - Skicka om KeyboardEvent


Arbetar på en Angular/TypeScript-app, där vi har en anpassad grundläggande textredigerare.

Försöker hantera på ett lämpligt sätt när en användare har ett markerat urval och sedan trycker på en tangent, med avsikt att ersätta urvalet.

För att hantera detta behöver vi korrekt ta bort de "gömda" komponenter som de har valt innan vi infogar deras avsedda innehåll.

Min första tanke var att:

  1. Fånga KeyDown-händelsen
  2. Kontrollera om det finns ett markerat intervall valt
  3. Om ja, radera allt valt innehåll
  4. Skicka om KeyDown-händelsen så att den infogar rätt innehåll

Här är en förkortad version av vår onKeyDown-metod:

cloneKeyboardEvent(eventToClone): KeyboardEvent {
    return new KeyboardEvent(eventToClone.type, {
        key: eventToClone.key,
        code: eventToClone.code,
        location: eventToClone.location,
        ctrlKey: eventToClone.ctrlKey,
        shiftKey: eventToClone.shiftKey,
        altKey: eventToClone.altKey,
        metaKey: eventToClone.metaKey,
        repeat: eventToClone.repeat
    });
}

onKeyDown($event: KeyboardEvent) {
    // Check if there's a selection
    if (this.isSelectionRange) {
        Helpers.stopEvent($event);

        // Delete components in selection
        this.deleteComponentsInSelection($event);

        const clonedEvent = this.cloneKeyboardEvent($event);
        document.dispatchEvent(clonedEvent);

        return true;
    }
}

Allt fungerar upp till #4.

clonedEvent matchar det ursprungliga händelsen, men det kommer inte att utlöst. Jag har infogat en debugger i början av onKeyDown() och den träffas bara en gång, vid den initiala keydown, inte vid dispatchEvent().

Relaterade artiklar