Within a contenteditable div, I have various child elements with different ids. When the cursor is moved inside the contenteditable tag, I want to retrieve the id of the element at the cursor position.
For example:
- If the cursor is on the word "one," the output should be the id of that element which is
1
. - If the cursor is on the word "two," the output should be
2
.
I have attempted to achieve this by getting the id of the parent element instead of the actual target element.
function check(e){
console.log($(e.target).attr('id'))
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div contentEditable="true" id="res" tabindex="2" onkeydown="check(event)">solve:
<span id="1">one</span>
<p id="2">two</p>
<i id="3">three</i>
</div>