Skip to content

Instantly share code, notes, and snippets.

@marijnh
Created April 16, 2016 20:02
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save marijnh/980fdd07315d7875d88950b6df62e04b to your computer and use it in GitHub Desktop.
Save marijnh/980fdd07315d7875d88950b6df62e04b to your computer and use it in GitHub Desktop.
Mobile Safari keyboard issue
<!doctype html>
<div contenteditable=true style="border: 1px solid black">Foo bar</div>
<p>Put the cursor at the start of the editable content above, so
that the keyboard is in uppercase mode. Then press <button>this
button</button> to move the cursor to the end of 'foo'. Note that the
keyboard stays in uppercase mode althrough lowercase would be
appropriate for the new context.</p>
<script>
document.querySelector("button").addEventListener("mousedown", function(e) {
e.preventDefault()
var s = getSelection(), r = document.createRange()
var para = document.querySelector("div")
r.setEnd(para.firstChild, 3)
r.setStart(para.firstChild, 3)
s.removeAllRanges()
s.addRange(r)
})
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment