HTML

Structure of content on the web

  • Web APIs

    Interfaces for building web applications

  • Learn
  • HTTP Observatory

    Scan a website for free

  • Web APIs
  • HTMLInputElement
  • Instance properties
    1. capture
    2. disabled
    3. formEnctype
    4. height
    5. max
    6. multiple
    7. popoverTargetAction
    8. selectionDirection
    9. src
    10. validity
    11. webkitdirectory
    12. checkValidity()
    13. setRangeText()
    14. stepUp()
  • Events
    1. search
    2. selectionchange
  • Inheritance
    1. EventTarget
  • Related pages for HTML DOM
    1. HTMLAnchorElement
    2. HTMLBaseElement
    3. HTMLDListElement
    4. HTMLDivElement
    5. HTMLFieldSetElement
    6. HTMLFrameSetElement
    7. HTMLHtmlElement
    8. HTMLLabelElement
    9. HTMLMediaElement
    10. HTMLModElement
    11. HTMLOptionElement
    12. HTMLPictureElement
    13. HTMLScriptElement
    14. HTMLStyleElement
    15. HTMLTableElement
    16. HTMLTextAreaElement
    17. HTMLUListElement
    18. History
    19. MessageEvent
    20. PageSwapEvent
    21. Plugin
    22. PluginArray
    23. ValidityState
    24. <input> or <textarea> element.

      The element must be focused for the call to have any effect.

      Optionally, you can specify the direction in which selection should be considered to have occurred. This lets you indicate, for example, that the selection was set by the user clicking and dragging from the end of the selected text toward the beginning.

      This method updates the HTMLInputElement.selectionDirection properties in one call.

      The element must be of one of the following input types: text, or url. Otherwise the browser throws an InvalidStateError exception.

      If you wish to select all text of an input element, you can use the HTMLInputElement.select() method instead.

    • Syntax

    js
    setSelectionRange(selectionStart, selectionEnd)
setSelectionRange(selectionStart, selectionEnd, selectionDirection)

    Parameters

    selectionStart

    The 0-based index of the first selected character. An index greater than the length of the element's value is treated as pointing to the end of the value.

    selectionEnd

    The 0-based index of the character after the last selected character. An index greater than the length of the element's value is treated as pointing to the end of the value. If selectionEnd is less than selectionStart, then both are treated as the value of selectionEnd.

    selectionDirection Optional

    A string indicating the direction in which the selection is considered to have been performed. Possible values:

    • "forward"
    • "backward"
    • "none" if the direction is unknown or irrelevant. Default value.

    Return value

    None (undefined).

    Exceptions

    InvalidStateError DOMException

    Thrown if the element is not one of the following input types: text, or url.

    Examples

    Click the button in this example to select the third, fourth, and fifth characters in the text box ("zil" in the word "Mozilla").

    HTML

    html
    <input type="text" id="text-box" size="20" value="Mozilla" />
<button onclick="selectText()">Select text</button>

    JavaScript

    js
    function selectText() {
  const input = document.getElementById("text-box");
  input.focus();
  input.setSelectionRange(2, 5);
}

    Result

    Specifications

    Specification
    HTML
    # dom-textarea/input-setselectionrange-dev

    Browser compatibility

    BCD tables only load in the browser

    See also