admin管理员组

文章数量:1420078

I've been puzzled as to why this behaviour happens on safari. I'm trying to get selection when i type some text and for that i use the window.getSelection() and it works perfectly fine on Firefox, Chrome, Opera and so on giving me something like:

Selection {}
anchorNode: text
anchorOffset: 14
baseNode: text
baseOffset: 14
extentNode: text
extentOffset: 14
focusNode: text
focusOffset: 14
isCollapsed: true
rangeCount: 1
type: "Caret"
__proto__: Selection

However on safari9 when i do the exact same thing, the result will be this:

Selection
anchorNode: null
anchorOffset: 0
baseNode: null
baseOffset: 0
extentNode: null
extentOffset: 0
focusNode: null
focusOffset: 0
isCollapsed: true
rangeCount: 0
type: "None"
__proto__: SelectionPrototype

I am wondering if this is something i'm doing wrong? If it's indeed a bug or it's not working is there a possible workaround? Or another method to obtain the same information that will work on most browsers?

I've been puzzled as to why this behaviour happens on safari. I'm trying to get selection when i type some text and for that i use the window.getSelection() and it works perfectly fine on Firefox, Chrome, Opera and so on giving me something like:

Selection {}
anchorNode: text
anchorOffset: 14
baseNode: text
baseOffset: 14
extentNode: text
extentOffset: 14
focusNode: text
focusOffset: 14
isCollapsed: true
rangeCount: 1
type: "Caret"
__proto__: Selection

However on safari9 when i do the exact same thing, the result will be this:

Selection
anchorNode: null
anchorOffset: 0
baseNode: null
baseOffset: 0
extentNode: null
extentOffset: 0
focusNode: null
focusOffset: 0
isCollapsed: true
rangeCount: 0
type: "None"
__proto__: SelectionPrototype

I am wondering if this is something i'm doing wrong? If it's indeed a bug or it's not working is there a possible workaround? Or another method to obtain the same information that will work on most browsers?

Share Improve this question asked Feb 8, 2016 at 23:29 galartgalart 561 silver badge7 bronze badges
Add a ment  | 

3 Answers 3

Reset to default 3

I'm running into a similar issue when I'm dealing with a contenteditable div and seems safari defaults user select to none which makes it so that user cant select anything. I did

[contenteditable] {
  -webkit-user-select: auto;
  user-select: all;
}

You can try replace [contenteditble] to input or other css elements.

UPDATE

I found a clean solution : Look at this : https://github./megahertz/jquery.get-word-by-event

it uses the click EVENT object (cleaner than window.getSelection I think):

var range = document.caretRangeFromPoint(event.clientX, event.clientY);

And it works great on iOS 12.

OLD POST

I had the same issue on iOS12 only (no mater -webkit-user-select)

I manage to get it work again by adding : contentEditable="true" to the Div container,

BUT (big BUT) unfortunately keyboard appears and content bees editable !! (which is pretty much expected...)

I'm still looking for a workaround @galart Did you find something ?

window.getSelection() actually works fine. The problem here is because when the focus is lost, then the selection is cleared as well.

本文标签: javascriptsafari getSelection() not workingStack Overflow