execCommandここで紹介したサンプルに基づいた基本的なエディターがあります。execCommand領域内にテキストを貼り付ける方法は 3 つあります。
- Ctrl+V
- 右クリック -> 貼り付け
- 右クリック -> プレーンテキストとして貼り付け
HTML マークアップなしのプレーン テキストのみを貼り付けられるようにしたいです。最初の 2 つのアクションでプレーン テキストを貼り付けるように強制するにはどうすればよいでしょうか。
考えられる解決策:私が考えられる方法は、( Ctrl+ V) のキーアップ イベントのリスナーを設定し、貼り付ける前に HTML タグを削除することです。
- それは最善の解決策でしょうか?
- 貼り付け時に HTML マークアップを回避することは万全でしょうか?
- 右クリック -> 貼り付けにリスナーを追加するにはどうすればいいですか?
ベストアンサー1
イベントをインターセプトしpaste、をキャンセルしpaste、クリップボードのテキスト表現を手動で挿入します。
http://jsfiddle.net/HBEzc/最も信頼できるのは次の通りです:
- あらゆる種類の貼り付け（Ctrl+ V、コンテキストメニューなど）をキャッチします。
- クリップボードのデータをテキストとして直接取得できるため、HTML を置き換えるために面倒なハックを行う必要がありません。
ただし、クロスブラウザのサポートについてはわかりません。
editor.addEventListener("paste", function(e) {
// cancel paste
e.preventDefault();
// get text representation of clipboard
var text = (e.originalEvent || e).clipboardData.getData('text/plain');
// insert text manually
document.execCommand("insertHTML", false, text);
});