In order to access this site you need to enable JavaScript!

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

removeAllRanges method (selectionRange)

Browser support:

9

Cancels the current selection.

Note: The selectionRange object and its removeAllRanges method 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.

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.
In Firefox from version 3, multiple areas of text can be selected by holding down the CTRL key while selecting.

You can add ranges to the current selection with the addRange method, and remove them with the removeRange and removeAllRanges methods.
Since only Firefox supports more than one range for the selection, in other browsers, the addRange method does not add new ranges to the selection if it already contains one.

The removeAllRanges method removes all Range objects that belong to the current selectionRange object, so it cancels the current selection.

Use the getRangeAt method to get the Range objects that represent the current selection and the rangeCount property to get their count.

In older Internet Explorer versions (and optionally in newer ones as well), use the empty method of the selection object to cancel the current selection.

Syntax:

object.removeAllRanges ( );

You can find the related objects in the Supported by objects section below.

Return value:

This method has no return value.

Example HTML code 1:

This example illustrates the use of the removeAllRanges method:

<head>
    <script type="text/javascript">
        function RemoveSelection () {
            if (window.getSelection) {  // all browsers, except IE before version 9
                var selection = window.getSelection ();                                        
                selection.removeAllRanges ();
            }
            else {
                if (document.selection.createRange) {        // Internet Explorer
                    var range = document.selection.createRange ();
                    document.selection.empty ();
                }
            }
        }
    </script>
</head>
<body>
    Select some text and use the following button to remove the selection.
    <button onclick="RemoveSelection ()">Remove selection!</button>
</body>