ホームページ > 記事 > ウェブフロントエンド > HTML での画像のドラッグ アンド ドロップを防ぐにはどうすればよいですか?
HTML での画像のドラッグ アンド ドロップを避ける
HTML ページに画像を表示したいが、ユーザーが画像をドラッグ アンド ドロップできないようにしたい場合それをドラッグして、さまざまな解決策を検討しましたが、役に立ちませんでした。この記事では、画像のドラッグを無効にして、制御を維持しながらサイズ変更できるようにする方法について説明します。
一意の ID またはクラスを使用して画像を識別するだけです。次に、イベント リスナーを「ondragstart」イベントに割り当てます。このイベント ハンドラー内で、ブラウザーのデフォルトのドラッグ アンド ドロップ動作を禁止するには、「false」を返します。バニラ JavaScript を使用した例を次に示します。
document.getElementById('my-image').ondragstart = function() { return false; };
また、jQuery を使用している場合は、次のコードを選択できます。
$('img').on('dragstart', function(event) { event.preventDefault(); });
これらの手法を実装すると、特定の要件に応じてサイズ変更を有効にしながら、HTML ページでの画像のドラッグを効果的に無効にします。
以上がHTML での画像のドラッグ アンド ドロップを防ぐにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。