Skip to content

Instantly share code, notes, and snippets.

@ControlledChaos
Last active Oct 2, 2016
Embed
What would you like to do?
Move the cursor to the end of the current text within in an input or textarea, rather than the default (highlighting the text).

Put Cursor at the End of Input Text

jQuery Plugin

jQuery.fn.putCursorAtEnd = function() {
return this.each(function() {
// Cache references
var $el = $(this),
el = this;
// Only focus if input isn't already
if (! $el.is( ':focus') ) {
$el.focus();
}
// If this function exists... (IE 9+)
if (el.setSelectionRange) {
// Double the length because Opera is inconsistent about whether a carriage return is one character or two.
var len = $el.val().length * 2;
// Timeout seems to be required for Blink
setTimeout( function() {
el.setSelectionRange( len, len );
}, 1 );
} else {
// As a fallback, replace the contents with itself
// Doesn't work in Chrome, but Chrome supports setSelectionRange
$el.val($el.val());
}
// Scroll to the bottom, in case we're in a tall textarea
// (Necessary for Firefox and Chrome)
this.scrollTop = 999999;
});
};
var searchInput = $("#search");
searchInput
.putCursorAtEnd() // should be chainable
.on("focus", function() { // could be on any event
searchInput.putCursorAtEnd()
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment