SetSelectionRange Is Not a Function

This seems so simple, but it's not working:

document.getElementById('test').setSelectionRange(3,3)
<div id="test">test</div>

Google Chrome.

3 Answers

<input id="test" value="hello world" />

var InputElement = $('test')[0] as HTMLInputElement;
InputElement.setSelectionRange(3, 3);
1

This is because the 'test' element needs to be an <input/> element. Try revising your HTML as follows:

<input id="test" />

Also consider the following changes to your javascript. With these updates to your code, your javascript should work as expected when there is enough text in your input field. For example, consider this code for selecting "world" in "hello world":

const input = document.getElementById('test');
input.focus();
input.setSelectionRange(6,11);
<input id="test" value="hello world" />

For more information, see the MDN docs for setSelectionRange()

4

To make this on <div> you should make it editable:

<div id="test" contenteditable="true">test</div>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Chloe Bennett

Chloe Bennett

Culture, Media & Entertainment Columnist

Chloe Bennett explores the intersection of pop culture, streaming entertainment, digital trends, and contemporary lifestyle. Her weekly commentary reaches thousands of culture enthusiasts.

Share this article
Twitter Facebook Pinterest