2017-11-15 8 views
0

イオンフレームワーク(v 1.3)は、contenteditable = 'true' DIVを妨害しています。私の言うとおり、私のクリックとドラッグイベントが正しく伝播することを妨げています。私の場合、WYSIWYGのテキストエディタをほとんど使用できません。イオンフレームワークは、編集可能なdivs + WYSIWYGエディタと干渉します。

contenteditable DIVにカーソルを合わせることができず、1つからテキストを選択することもできません。 Trixエディタ(これも使用しています)を使用すると、初期フォーカスを得ることができますが、カーソルをどこにでも置くことも、テキストを選択することもできません。

ここでIonicの動作を無効にする方法はありますか?

私は2つのペインが基本contenteditable問題とトリックスエディタと連携して問題を実証してPlunker hereを作成しました。

デモンストレーション用法:

<ion-view title="ContentEditable Example"> 
    <ion-content class="has-header padding"> 
    <div contenteditable="true" style="user-select: all; -webkit-user-select: all;"> 
     <p>ContentEditable Text. This is a DIV with contenteditable set to true, AND user-select set to all. Note how you cannot click and edit the text!</p> 
    </div> 
    </ion-content> 
</ion-view> 

答えて

1

私はcontenteditableのdivの使用だけでなく、イオン性でトリックスエディタを有効に解決策を見つけました。このクラスをCSSに適用し、ブラウザや実際のデバイスでテストしても問題は発生していません:

.editable{ 
    user-select: text; 
    -webkit-user-select: text; 
    pointer-events: all !important; 
    -webkit-user-modify:read-write !important; 
} 
関連する問題