HTML ページ上での画像のドラッグを防ぐにはどうすればよいですか?

HTML ページでの画像のドラッグの無効化

Web ページに画像を組み込む場合、多くの場合、ユーザーが画像をドラッグ アンド ドロップできないようにすることが望ましいです。この記事では、この問題に対処する解決策について詳しく説明します。

画像のドラッグを無効にするには、ondragstart イベントを使用できます。指定した画像に対して false を返すようにこのイベントを設定すると、ドラッグが事実上無効になります。

document.getElementById('my-image').ondragstart = function() { return false; };

このコードは、ondragstart イベントを ID (この場合は my-image) によって HTML 要素に割り当てます。ユーザーが画像のドラッグを開始すると、イベントがトリガーされ、return false ステートメントによってデフォルトのドラッグ アンド ドロップ動作が防止されます。

jQuery を使用している場合は、少し異なるアプローチを採用できます。

$('img').on('dragstart', function(event) { event.preventDefault(); });

このコードは、すべての のドラッグスタート イベントにコールバック関数をバインドします。ページ上の要素。画像がドラッグされると、jQuery はevent.preventDefault() を呼び出して、ドラッグ機能を抑制します。

以上がHTML ページ上での画像のドラッグを防ぐにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。