Tor: Hängen Sie einen Keydown-Ereignishandler an einen inhaltsbearbeitbaren Bereich an, der das untergeordnete Element eines inhaltsbearbeitbaren Div ist.

Problem: Wenn Sie die Spanne eingeben, wird das übergeordnete Ereignis ausgelöst, nicht das untergeordnete Ereignis. Ich möchte, dass das Kind auslöst, damit ich den Text erfassen kann. Ich will nur DIESES zufriedenstellende Kind, da es viele geben wird.

HTML / JS ist unten und der Fiddle-Link ist hier:http://jsfiddle.net/aBYpt/4/

HTML

<div class="parent" contenteditable="true">
    Parent div text.

    <span class="child" contenteditable="true">First child span text.</span>
    <span class="child" contenteditable="true">Second child span text.</span>
    <span class="child" contenteditable="true">Third child span text.</span>
</div>

<div id="console"></div>

JavaScript / jQuery

$(document).on( 'keyup', '.parent', function() {
    $('#console').html( 'Parent keyup event fired.' );
    //do stuff
});

$(document).on( 'keyup', '.child', function() {
    $('#console').html( 'Child keyup event fired.' );
    //do stuff
});

** Hinweis: Die Ereignisbehandlung wird an das Dokument delegiert, da Elemente dynamisch hinzugefügt werden.