is there no way to create a reversed (i.e. right-to-left) selection from JavaScript? - Stack Overflow

admin管理员组

文章数量:1291147

I'm trying to create a selection that goes from right to left in the text, but it seems the DOM Range API doesn't let me do that. (I don't see anything about this in the spec - not that I read it closely - but all implementations seem to agree on not supporting it.)

For example, given a very minimal document:

data:text/html,<div> this is a test </div>

I can use this script to enable editing and create a normal selection (for example from a bookmarklet, but line wrapping added for clarity):

javascript:document.designMode='on';
var r=document.createRange(),d=document.getElementsByTagName('div')[0]; 
r.setStart(d.firstChild, 3); 
r.setEnd(d.firstChild, 7); 
window.getSelection().addRange(r); void(0);

However, if I swap 3 and 7 no selection is created.

Does anyone know a way to do this?

I'm trying to create a selection that goes from right to left in the text, but it seems the DOM Range API doesn't let me do that. (I don't see anything about this in the spec - not that I read it closely - but all implementations seem to agree on not supporting it.)

For example, given a very minimal document:

data:text/html,<div> this is a test </div>

I can use this script to enable editing and create a normal selection (for example from a bookmarklet, but line wrapping added for clarity):

javascript:document.designMode='on';
var r=document.createRange(),d=document.getElementsByTagName('div')[0]; 
r.setStart(d.firstChild, 3); 
r.setEnd(d.firstChild, 7); 
window.getSelection().addRange(r); void(0);

However, if I swap 3 and 7 no selection is created.

Does anyone know a way to do this?

• javascript
• selection
• range

Share Improve this question Follow asked Jan 26, 2011 at 4:42 hallvorshallvors 6,23911 gold badge2828 silver badges4646 bronze badges 2

• What is the difference between a range that goes left to right, and right to left? As far as I can see, the only difference is the ability to extend the selection with the arrows to the left. – Ruan Mendes Commented Jan 26, 2011 at 5:10
• @Juan: I may be missing some subtleties, but like you, the main difference I can see is arrow key behaviour (all arrow keys, with and without Shift and Ctrl modifier keys). Also, in some environments and browsers, the caret is displayed in addition to the selection, at the focus of the selection (i.e. the point at which the user stopped selecting). – Tim Down Commented Jan 26, 2011 at 9:44

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 14

It's possible in recent versions of all major browsers except IE via the extend() method of the Selection object. Here's a function that creates a backwards selection from a Range:

function selectRangeBackwards(range) {
    var sel = window.getSelection();
    var endRange = range.cloneRange();
    endRange.collapse(false);
    sel.removeAllRanges();
    sel.addRange(endRange);
    sel.extend(range.startContainer, range.startOffset);
}

This is not possible in any version of IE (up to and including version 11). While IE 9 and later does implement DOM Level 2 Range and HTML5 Text Selection (now migrated to the WHATWG Range spec), the version of the spec at the time they implemented it did not include extend(), so IE 9 does not support it (see also this bug for further discussion of backwards selections).

Here is the request to implement extend() in the IE bug tracker: https://connect.microsoft./IE/feedback/details/737106/implement-missing-extend-method-of-selection

In earlier versions of IE, the selection API is pletely different and does not have any support for programmatically creating backwards selections either.

本文标签： is there no way to create a reversed (ie righttoleft) selection from JavaScriptStack Overflow