0

I've got a template full of contenteditable areas that may or maynot already have id attributes. The one difference is that they all contain unique data- values so I'd like to use them to help me target/focus my cursor programically on specific areas for editing.

If I store the data- value in a var this way:

textArea[0] = this.getAttribute("data-id");

and my user looses focus on the contenteditable area they are currently work in, how can I force the cursor back to it?

document.[data-id=textArea[0]].focus();

Thank you for your time.

Vince
  • 910
  • 2
  • 13
  • 29

1 Answers1

2

If you use vanilla js, you can write something like:

document.querySelectorAll('[data-id="' + dataId + '"]')[0].focus()

(check this answer on how to select elements by attribute)

If you can use Jquery you can just have:

$('[data-id="' + dataId + '"]').focus();

You can check also this fiddle in case

Community
  • 1
  • 1
Dario
  • 6,152
  • 9
  • 39
  • 50