Why doesn't @contenteditable work on the iPhone?

Question

Safari HTML Reference: Supported Attributes says:

contenteditable

If true, the element can be edited on the fly; if false, it cannot.

Availability

Available in Safari 1.2 and later. Available in iPhone OS 1.0 and later.

However, on my iPhone, I can't get it to work. Anyone have success with this?

You can try it with this document (admittedly not pure html, but that document works in desktop Safari, and Chrome and Firefox 3). I haven't been able to get even the simplest html document to be editable in mobile Safari.

I don't think you'll get an answer for this since it would require insight from someone at apple. You could also file a bug: https://bugreport.apple.com Maybe you could rephrase the question to what you need to accomplish so we could come up with alternatives? — Jason Harwig, Nov 04 '09 at 18:41
I wondered why Google Spreadsheet editing on iPhone OS was the way it is. Now it makes sense: click the Edit link, little boxes open up for each cell on the row, fill in the numbers, click "submit," click "refresh." It's doing a little
. — Thomas L Holaday, Apr 19 '10 at 22:04
contenteditable still does not work on ios 4.1 or 4.2 gold master. — morgan, Nov 09 '10 at 14:34
i don't have os4 beta 2 on my iphone but on the os4 beta 2 emulator it's still business as usual (doesn't work)... please post a video.. i'd kill to see this working because it's the only thing stopping me from claiming iphone/ipad compatibility for my web app. — morgan, May 04 '10 at 03:38
contenteditable absolutely does not work on the iphone or ipad.. still. — morgan, Oct 30 '10 at 01:06
i can confirm contenteditable still doesn't work with ios 4.3 — morgan, Mar 05 '11 at 20:42
Noooooo! What about the HTML5 History API - when you go here http://balupton.com/sandbox/history.js/demo and add a few states do the back and forward buttons of safari work? Thanks btw :) — balupton, Mar 06 '11 at 01:41

kirb · Accepted Answer · 2011-12-06T11:33:12.457

8

contenteditable has been added to iOS 5 beta 2, according to one of the developer videos from WWDC 2011. I suggest signing up to Apple's Safari developer program and downloading that video from the WWDC videos page.

If you sign up to be a Safari dev, you also gain the privilege to submit your Website to their online iOS Web app gallery.

Edit: I've confirmed this works on my iPad running iOS 5.0.1. Try it out here: http://www.quirksmode.org/dom/execCommand/

edited Dec 06 '11 at 11:33

answered Sep 02 '11 at 23:23

kirb

2,033
1
18
28

Thanks for this; I'll accept this as the answer as soon as someone playing with the beta can confirm it is real. – JasonPlutext Sep 13 '11 at 10:15
It must be real as CKEditor has added support for iOS5: http://ckeditor.com/blog/CKEditor_3.6.2_released – AlfonsoML Sep 17 '11 at 22:10
yes, iOS5 does support contenteditable. anything lower, does not. – odle Feb 02 '12 at 15:07

score 2 · Answer 2 · answered Jun 15 '10 at 00:42

It works, kind of. I thought contenteditable doesn't work on iPhone before. When I set a div to contenteditable I couldn't move the cursor/pointer to where I wanted to move it. But, when I was fiddling around XHTML with contentEditable within iBooks.app on iPad, I found that "execCommand('insertText', null, 'foobar');" worked within Mobile Safari.

score 1 · Answer 3 · answered Nov 18 '10 at 06:02

1

If you wanted to, you could make a virtual keyboard using clever css and javascript, and make it into a bookmarklet.

answered Nov 18 '10 at 06:02

Anonymous

11
1

score 1 · Answer 4 · answered Jan 08 '20 at 20:28

1

If you cannot focus the contenteditable element try adding this to your css

[contenteditable] {
    -webkit-user-select: text;
    user-select: text;
}

answered Jan 08 '20 at 20:28

Mark

370
5
10

score 0 · Answer 5 · answered Dec 19 '11 at 13:06

0

The design mode and content editable are working fine in IOS 5.But in previous versions it is not working.There is post

http://mobile.tutsplus.com/tutorials/mobile-web-apps/safari-5_html5/

answered Dec 19 '11 at 13:06

sunnychayen

434
4
9

score -3 · Answer 6 · answered Jun 29 '09 at 18:39

-3

I think this is because editing HTML requires quite an advanced user interface. That's why desktop Safari implements it, while Mobile Safari doesn't.

answered Jun 29 '09 at 18:39

ilya n.

18,398
15
71
89

9

This is an excuse, not an answer. In desktop Safari, you don't get any fancy controls, just the ability to type into an element. Surely, iPhone can support that. – Andrew Hedges Sep 10 '09 at 09:39

Why doesn't @contenteditable work on the iPhone?

6 Answers6

Linked

Related