contenteditable 変更イベント 質問する

contenteditable 変更イベント 質問する

ユーザーがdivwithcontenteditable属性のコンテンツを編集したときに関数を実行したいです。イベントに相当するものは何ですかonchange?

私は jQuery を使用しているので、jQuery を使用するソリューションが望ましいです。ありがとうございます!

ベストアンサー1

2022年アップデート

コメントで指摘されているように、これはイベントchangeではなくイベントと同等のものを求めた質問への回答ではありませんinput。ただし、ここではそのままにしておきます。

元の回答

編集可能な要素によって発生する主要なイベントにリスナーをアタッチすることをお勧めしますが、コンテンツ自体が変更される前に および イベントが発生することkeydownに注意する必要があります。これは、コンテンツを変更するすべての手段を網羅しているわけではありません。ユーザーは、編集メニューまたはコンテキスト ブラウザー メニューから切り取り、コピー、貼り付けを使用することもできるため、およびイベントも処理する必要がある場合があります。また、ユーザーはテキストやその他のコンテンツをドロップできるため、そこではさらに多くのイベントが発生します (など)。フォールバックとして、要素のコンテンツをポーリングする必要がある場合があります。keypresscut copypastemouseup

2014年10月29日更新

HTML5inputイベント長期的にはこれが答えです。執筆時点では、contenteditable現在の Mozilla (Firefox 14 以降) および WebKit/Blink ブラウザーの要素ではサポートされていますが、IE ではサポートされていません。

デモ:

document.getElementById("editor").addEventListener("input", function() {
    console.log("input event fired");
}, false);
<div contenteditable="true" id="editor">Please type something in here</div>

デモ:http://jsfiddle.net/ch6yn/2691/

おすすめ記事