contenteditable insideとiframeでdivをダブルクリックするとdivが無効になる

Question

iframe内でcontenteditable trueのdivを作成し、ダブルクリックすると機能しなくなります。フォーカスはまだiframeに表示されていますカーソルはkeydownに応答しません

私はこれをどのように克服できますか？

編集：私は道場のエディタを実装している

。 ipadでthis linkを開くと、上記の問題が表示されます。

Answer 1

iframe内で動作するcontenteditable divを取得しようとすると複雑ですが、Dojoエディタのような特定のWYSIWYGエディタ内で動作させようとすると、別のレベルが難しくなります。インタラクションに影響を与える多くのJavaScript。それはあなたの質問に少し良いパラメータを説明するのに役立ちます。

ブラウザのデバッガ（Firebugなど）を使用して、クリックしたときの状況を確認しましたか？

この他のSO question and answer about contenteditable div vs iframeが有用です。

最後に、iOS Safariを使用している場合は、contenteditable属性がonly recently supported on that browserだったので、Safari 5.0以上を使用していることを確認してください。

EDIT：あなたはiOSの6を使用しているので 、あなたが編集可能なdiv要素をクリックしたときには、もう少し明確に何が起こっているか知っているようにthe iOS Safari JavaScript Debuggerを使用する必要があります。より具体的なエラーメッセージが表示された場合は、当社にご連絡ください。

Answer 2

使用しているOSはどれですか？ OS 5.0以降を使用していることを確認する必要があります。 (Apple's Technical Notes) and Safari Web Content Guideに従う。それは書かれています：

HTML contenteditable属性は、iOS 5.0以降ではでサポートされています。以前のバージョンでは、スタイル付き要素内のテキスト入力を有効にするために使用されるcontenteditableを、スタイル付きtextarea要素に置き換えてください。 Safariでは、CSSを使用してtextarea要素の外観をカスタマイズできます。必要に応じて、-webkit-appearanceをnoneに設定することで、プラットフォーム固有の組み込みスタイルをテキストエリア要素で無効にすることもできます。

古いOSバージョンを使用している場合、contenteditableではなくtextarea個の要素を使用できます。その後、アプリケーションも同様に動作することが保証されます。

PS。 IPADを使用してwebsiteに行き、textareaとどのように動作するか試してみてください。それはあなたのための例かもしれません。

希望に役立ちます。