Webページで右クリックができない、文字列が選択できないときの解決方法

未分類
この記事は約2分で読めます。

Webページを閲覧中に、右クリックができない、文字列が選択できないといった問題が発生することがあります。これは、Webページの制作者がセキュリティを向上させるために、意図的に設定したものである場合があります。

しかし、ユーザーが必要とする機能が制限されていると不便に感じることもあるでしょう。このような場合、ブラウザ拡張機能を使用することで、右クリックやテキスト選択などの制限を解除することができます。

SuperCopy

SuperCopy スーパーコピー - Chrome ウェブストア
クラック禁止右キー、クラッキング禁止の選択肢、クラッキングはコピーを禁止し、クラック禁止貼り付け

上記のSuperCopyを使うことで大体のホームページの右クリック禁止やテキストの選択およびコピーが制限なく可能になります。

右クリックとテキスト選択が実際にできるようになるかをテストするためのサイト

SuperCopyを入れて、いざ、右クリックやテキスト選択ができないサイトで試してみよう!

テストするサイトとして以下のサイトがおすすめです。いろいろなタイプの右クリック、テキスト無効化が設定されたテストページになっています。

Test Right Click
This page shows you whether the right-click action is allowed or not on restricted elements. Try to right-click on desig...

実際に、サイトで試してみると右クリックとテキスト選択ができるようになったことが確認できるはずです。

実際にどのような設定がHTMLでおこなわれているのか?

ブログ上で右クリックを禁止するためのコード

 document.addEventListener('contextmenu', event => event.preventDefault());

このコードは、contextmenu イベントをリッスンして、イベントが発生したときに preventDefault() メソッドを呼び出して、右クリックメニューが表示されないようにします。

ブログ上でテキスト選択を禁止するためのCSS

body {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

これは、CSSの user-select プロパティを使用して、テキストの選択を無効にする方法です。上記のCSSコードを body 要素に適用することで、ブログのすべてのテキスト選択を禁止することができます。

タイトルとURLをコピーしました