Set And Get Caret Position Using jQuery - Caret.js

Caret.js is a tiny jQuery plugin created to set and get caret (text cursor) position in textarea, input, or contenteditable element.

See Also:

• Set & Get The Position Of The Text Insertion Point
• Teminal-style Caret In Text Field - Caret.js
• Fire An Event On Caret Position Change - jQuery Position Event
• Handle Caret Position Change Event In Input Field - jQuery caretchange

How to use it:

1. Load the Caret.js script right before the </body> tag but after jQuery library.

<script src="/path/to/cdn/jquery.min.js"></script>
<script src="/path/to/jquery.caret.js"></script>

2. Get the caret position.

<!-- Textarea -->
<textarea id="example">
  ... Any Content Here ...
</textarea>

<!-- Or Input Field -->
<input id="example" />

<!-- Or contenteditable -->
<div id="example" contenteditable="true">
  ... Any Content Here ...
</div>

$('#example').caret();

3. Set the caret position.

$('#example').caret(1);
$('#example').caret(-1);
...

---

This awesome jQuery plugin is developed by accursoft. For more Advanced Usages, please check the demo page or visit the official website.