CODEWITHSUNDEEP
jquerytinymcewysiwygtinymce-4
Samul
Samul

Reputation: 2019

How to get the element that received the keydown event in TINYMCE

I want to attach a keydown event to my TINYMCE so when a user hits ENTER in his keyboard AND any parent element of the element that fired the keydown has a certain class I would like to show a message (alert) to the user.

So far, after searhing in Google I came up with this:

editor.on("keydown",function(e) {

    if (   (e.keyCode == 13)   &&   (CONDITIONAL)   ) {

        alert('You are not supposed to do this.');

    }

});

My problem is that this function does not return the inner most (deepest) element that fired the event. How can I get it?

For example, I have this HTML being edited inside tinymce:

<div id="xxx">

    <p class="paragrapch">

        <div>

            <span id="zzz">USER IS TYPING HERE</span>

        </div>

    </p>

</div>

Suppose user is typing something inside the element span#zzz , how can I make the keydown event fire to this element so I can look in all its parent and see if someone has a class "paragraph"?

With jquery this is pretty simples, just use: 

$(this).parents(".paragraph").length

BUT if I use the first code that I posted here, "$(this)" is not the inner most element (deepest), it's the body element.

Upvotes: 1

Views: 652

Answers (1)

Michael Fromin
Michael Fromin

Reputation: 13726

Try using 

editor.selection.getNode()

...that should get you the element containing the cursor.

Upvotes: 2

Related Questions