25

javascriptで右クリックして選択したペーストを処理するにはどうすればよいですか? 「onpaste」イベントと他のすべての html イベントを使用してみましたが、何も機能しません。

4

4 に答える 4

31

onpaste イベントは、最新のすべてのブラウザー ( Opera を含むUPD >= 12.10 1 ) で動作するはずです。

次のように jQuery にバインドします。

$('#txt').on('paste', function() {console.log('text pasted!')})​

これが実際の例です: http://jsfiddle.net/7N6Xq/

純粋な JavaScript では、最新のブラウザーでは次のようになります。

elem.addEventListener ("paste", handler, false);  // all browsers and IE9+

古い IE バージョンの場合:

elem.attachEvent ("onpaste", handler);  // IE<9

oninputやその他のイベント ( change、propertychange、dragdropなど) と組み合わせて、コンテンツの変更を比較的確実に追跡することもできます。

脚注:

1 Opera は、 Presto/2.10.286以降のクリップボード API をサポートしています。これは、こちらで提案されている 12.10 に対応しています。Opera のBlink バージョン(15 以降) もサポートされているはずですが、まだ Linux バージョンがないため、テストできません。

于 2012-05-31T12:52:08.790 に答える
2

イベントは、デフォルトでは「onpaste」IIRC として公開されません。発行することにより、jQueryで非常に簡単に行うことができます

jQuery(document).bind('paste', function(e){ alert('paste event caught') });
于 2012-05-31T12:45:28.373 に答える
1

Mozilla dev サイトで、素敵な純粋な JS ソリューション (要求に応じて...) を利用できます。

<!DOCTYPE html>
<html>
<head>
<title>onpaste event example</title>
</head>

<body>
<h1>Play with this editor!</h1>
<textarea id="editor" rows="3" cols="80">
Try pasting text into this area!
</textarea>

<script>
function log(txt) {
  document.getElementById("log").appendChild(document.createTextNode(txt + "\n"));
}

function pasteIntercept(evt) {
  log("Pasting!");
}

document.getElementById("editor").addEventListener("paste", pasteIntercept, false);
</script>

<h2>Log</h2>
<textarea rows="15" cols="80" id="log" readonly="true"></textarea>
</body>
</html>
于 2014-05-24T23:28:32.327 に答える
1

afterpaste イベントをキャプチャしたい場合に何が起こるかについて、質問 #4532473 が未回答のままクローズされたことに驚きました。これはおそらくケースの半分の問題であるため、Firefox (テスト済み) で可能なアプローチは、onpaste ハンドラー内で oninput イベントを登録し、実行が終了したらすぐに oninput ハンドラーを削除することです。

つまり、oninput の代わりに onpropertychange を使用する必要があります。（未検証）

于 2012-07-03T07:29:03.393 に答える