[解決済み] JavaScriptでCtrl+V, Ctrl+Cを検出するには?
2022-04-13 18:17:50
質問
検出方法 ctrl + v , ctrl + c Javascriptを使用していますか?
テキストエリアでの貼り付けを制限したいのですが、エンドユーザーはコンテンツをコピー&ペーストできないようにし、ユーザーはテキストをテキストエリアに入力するだけでよくなります。
どうすれば実現できますか?
どのように解決するのですか?
興味本位でやってみただけです。正しいことではないとは思いますが、オペが決めるべきことだと思うので...。また、このコードは、機能を奪うのではなく、機能を追加するために簡単に拡張することができます(より高度なクリップボード、または Ctrl + s サーバーサイドの保存をトリガーする)。
$(document).ready(function() {
var ctrlDown = false,
ctrlKey = 17,
cmdKey = 91,
vKey = 86,
cKey = 67;
$(document).keydown(function(e) {
if (e.keyCode == ctrlKey || e.keyCode == cmdKey) ctrlDown = true;
}).keyup(function(e) {
if (e.keyCode == ctrlKey || e.keyCode == cmdKey) ctrlDown = false;
});
$(".no-copy-paste").keydown(function(e) {
if (ctrlDown && (e.keyCode == vKey || e.keyCode == cKey)) return false;
});
// Document Ctrl + C/V
$(document).keydown(function(e) {
if (ctrlDown && (e.keyCode == cKey)) console.log("Document catch Ctrl+C");
if (ctrlDown && (e.keyCode == vKey)) console.log("Document catch Ctrl+V");
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h3>Ctrl+c Ctrl+v disabled</h3>
<textarea class="no-copy-paste"></textarea>
<br><br>
<h3>Ctrl+c Ctrl+v allowed</h3>
<textarea></textarea>
また、このスクリプトには jQuery ライブラリが必要であることを明記しておきます。
EDIT: Tim Down氏の提案により、冗長な3行を削除(e.whichを含む)(コメント参照)。
EDIT: Mac への対応を追加 ( cmd キーの代わりに ctrl )
関連
-
vue ディレクティブ v-html と v-text
-
[解決済み】ERROR エラーです。スイッチのname属性が指定されていないフォームコントロールの値アクセッサがない
-
[解決済み] 配列から特定の項目を削除するにはどうすればよいですか?
-
[解決済み] jQueryで要素が非表示になっているかどうかを確認するには?
-
[解決済み] JavaScriptで文字列が部分文字列を含むかどうかを確認する方法は?
-
[解決済み] あるJavaScriptファイルを他のJavaScriptファイルにインクルードするにはどうすればよいですか?
-
[解決済み] jQueryで要素にスクロールする
-
[解決済み] CSSでテキストや画像の背景を透明にするには?
-
[解決済み] リンクのように動作するHTMLボタンを作成する方法
-
[解決済み】別のウェブページにリダイレクトするにはどうすればいいですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
JavaScriptにおけるマクロタスクとミクロタスクの詳細
-
HTML+CSS+JavaScriptで簡単な三目並べゲームを作成する。
-
VUEグローバルフィルターの概念と留意点、基本的な使い方
-
[解決済み] Error : 未定義のプロパティ 'map' を読み取ることができません。
-
[解決済み】Node Version Manager のインストール - nvm コマンドが見つかりません。
-
[解決済み】Node.jsで "Cannot find module "エラーを解決するには?
-
[解決済み】ExpressJS - throw er Unhandled errorイベント
-
[解決済み】ExpressJS : res.redirect()が期待通りに動かない?
-
JavaScriptのgetElementById、getElementsByTagNam、getElementsByClassNameの違いと使い方
-
[解決済み] HTML5でfloat入力タイプはありますか?