問題タブ [contenteditable]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
4 に答える
13892 参照

javascript - Javascript contenteditable div にテキストを挿入する

テキスト(文字列、htmlタグがある場合とない場合があります)をに挿入する方法はありますdivか?

である必要があり、 ではdivありませんtextarea

まず、カーソル位置を取得し、その位置にテキストを挿入する必要があります。function に似ていますinsertAdjacentTextが、タグの前後にのみ挿入でき、IE でのみ機能します。

この URL を参照してください: http://yart.com.au/test/iframe.aspx。カーソルを div に配置する方法に注意してください。カーソル位置にテキストを追加する必要があります。

0 投票する
6 に答える
13852 参照

image - Firefox - designMode: 画像のサイズ変更ハンドルを無効にする

ユーザーが designMode で画像のサイズを変更できないようにするにはどうすればよいですか? (画像がクリックされたときにハンドルを無効にします)

0 投票する
11 に答える
49315 参照

javascript - contentEditable での改行/段落の区切りを防ぐ

Firefox で contentEditable を使用する場合、ユーザーが Enter キーまたは Shift+Enter キーを押して段落や改行を挿入できないようにする方法はありますか?

0 投票する
6 に答える
23018 参照

javascript - IE で contentEditable を使用するリスク

製品に基本的な HTML エディターを追加する必要があります。現時点では IE のみをサポートしているため (ほとんどのお客様はまだ IE 6 を使用しています)、たとえば「 Web ページの編集<div contentEditable="true">」で説明されているように、Internet Explorer に組み込まれている XHTML 編集機能を使用するように言われました。

のブラウザで動作しないことは別として。(経営陣はそれを問題とは考えていません。顧客は IE でのみ動作するソフトウェアに我慢します。IE でのみ動作するソフトウェアで損失を出したことは一度もありません。現在、ほとんどの顧客はいずれにせよ、スタッフに IE6 のみを使用させます。 )

contentEditable を使用すると、にどのような問題が発生する可能性がありますか?


アップデート

私が「contentEditable」で書いた HTML エディターは、信頼性を得るのが非常に難しく、多くの問題がありました。これをやり直さなければならない場合は、多くのオープン ソース ソリューション (TinyMCE など) の 1 つを強く推し進めるか、サポートされている HTML エディターを購入します。

非常に熟練した jscript プログラマーであれば、十分な時間があれば、「contentEditable」を適切に機能させることができることは間違いありません。Web 上のすべての例は非常に単純に見えますが、単語から切り取り/貼り付けを行い、結果の HTML を編集しようとするなどの一般的な操作をテストするまでは. (顧客が行うことの種類のみ)

(stackoverflowで「contentEditable」を検索して、他の人が抱えていた問題の理想を手に入れてください)

0 投票する
3 に答える
1207 参照

firefox - XML/複合ドキュメントのノードで contentEditable?

スタイルシートが添付された XML ドキュメントを Web ブラウザに表示しています。

xhtml 名前空間宣言と xhtml:script タグを使用すると、javascript を実行できます。

私がやりたいことは、このドキュメント コンテンツ内の XHTML 以外の任意の要素を編集可能にすることです。(実際には、それらは別の名前空間にあります)

@contentEditable="true" を明示的に追加しても (つまり、Javascript に頼らずに)、コンテンツは実際には編集できません (Firefox 3.0.4 の場合)。

現在のブラウザで編集することはできますか? ( XHTML 1.0 Transitional ドキュメントの<div contentEditable="true">Edit me > には問題はありませんでした)</div

このドキュメント (Firefox) では、xhtml:div を編集することさえできません。それができれば、前に進む道が開けるかもしれません。

0 投票する
6 に答える
11619 参照

iphone - @contenteditable が iPhone で機能しないのはなぜですか?

Safari HTML リファレンス: サポートされる属性には次のように書かれています。

コンテンツ編集可能

true の場合、要素はその場で編集できます。false の場合、それはできません。

可用性

Safari 1.2 以降で使用できます。iPhone OS 1.0 以降で利用できます。

しかし、私のiPhoneでは、それを機能させることができません。誰でもこれで成功していますか?

このドキュメントで試すことができます(確かに純粋な html ではありませんが、このドキュメントはデスクトップの Safari、Chrome および Firefox 3 で動作します)。最も単純な html ドキュメントでさえ、モバイル Safari で編集可能にすることができませんでした。

0 投票する
1 に答える
3144 参照

keyboard-events - contenteditable divの子要素のキーボードイベント?

contenteditable プロパティが true に設定されている div があります。子をキーボード イベントに応答させるにはどうすればよいですか? 唯一の方法は、親 div でイベントをキャプチャし、選択 API を介して子を把握することです。より良い方法はありますか?具体的には、キーボード イベント ハンドラーを子要素にアタッチできますか? 何か不足していますか?

問題を説明するサンプル コードが添付されています。コード内のコメントが十分に説明されていることを願っています。

0 投票する
2 に答える
2441 参照

php - jquery contenteditable改行

私はコンテンツ編集可能領域を持っていて、新しい段落の作成からエンター/リターンとシフトエンターを無効にしようとしています.これは以下のスクリプトで動作していますが、ボタンをすべて無効にします.新しい段落に移動するのではなく、改行を配置します。

すべての助けに感謝します!

乾杯、

ワザ

0 投票する
5 に答える
10768 参照

javascript - Javascript - テキストエリア内の特定のテキストのフォントの色を変更する

テキストエリア内の特定のテキストの色を変更できるJS関数はありますか?

たとえば、blar blar {blar} blar, {blar} は { } を含み、青色になります。他の単語は空白になります。つまり、必要なのは { } 内のすべてのテキストの色を変更できる関数だけです。

私はいくつかの研究を行いましたが、ほとんどの人はそれができないと言っているようです. しかし、リッチ テキスト エディターや、単語に太字や下線を引く機能を持つ wysiwyg エディターを見ています。それを行う方法があるはずです。

どんな提案でも大歓迎です。