You are here: Reference > JavaScript > client-side > selection and ranges > properties > isCollapsed (selectionRange)

isCollapsed property (selectionRange)

Browser support:
9
Returns a Boolean value that indicates whether the anchor and focus points of the current selectionRange object are in the same position.
Note: The selectionRange object and its isCollapsed property are supported in Internet Explorer from version 9.
The selectionRange object represents the current selection and every Range object that belongs to the selectionRange object represents a contiguous part of the selection. If there is no selection in the document, then no Range object belongs to the selectionRange object.
In that case, the isCollapsed property returns true.
You can get the count of the Range objects that belong to the current selection with the rangeCount property.
  • In Internet Explorer, Opera, Google Chrome, Safari and Firefox before version 3, at most one Range can belong to the selectionRange object, because text selection is always a contiguous part of the DOM hierarchy. If one Range object belongs to the current selection, then the isCollapsed property indicates whether it is empty or not.
  • In Firefox from version 3, multiple areas of text can be selected by holding down the CTRL key while selecting. If multiple ranges are added to the selection (by the user or by script, see the addRange method), then use the collapsed property of the Range objects for similar functionality.
Use the getRangeAt method to get the Range objects that represent the current selection.
If you need to collapse a selectionRange object, use the collapse method.

Syntax:

object.isCollapsed;
You can find the related objects in the Supported by objects section below.
This property is read-only.

Possible values:

Boolean that indicates the relation between the anchor and focus points.
One of the following values:
false
The anchor and focus points are in different positions.
true
The anchor and focus points are at the same position.
Default: this property has no default value.

Example HTML code 1:

This example illustrates the use of the isCollapsed property:
<head>
    <script type="text/javascript">
        function TestSelection () {
            if (window.getSelection) {  // all browsers, except IE before version 9
                var selectionRange = window.getSelection ();

                if (selectionRange.isCollapsed) {
                    alert ("No content is selected!");
                }
                else {
                    alert ("The text content of the selection:\n" + selectionRange.toString ());
                }
            }
            else {          // Internet Explorer before version 9
                var textRange = document.selection.createRange ();
                if (textRange.text.length == 0) {
                    alert ("No content is selected!");
                }
                else {
                    alert ("The text content of the selection:\n" + textRange.text);
                }
            }
        }
    </script>
</head>
<body>
    You can get the text content of the selection with the button below.
    <br /><br />
    <button onclick="TestSelection ()">Test selection</button>
</body>
Did you find this example helpful? yes no

Supported by objects:

Related pages:

External links:

User Contributed Comments

Post Content

Post Content