Bagaimanakah saya boleh menghalang penyeretan imej dalam HTML?

Menghalang Penyeretan Imej dalam HTML

Menyeret imej dari halaman web boleh menjadi ciri yang tidak diingini, terutamanya apabila anda mempunyai manipulasi imej tersuai atau interaksi dalam tempat. Artikel ini membincangkan penyelesaian untuk melumpuhkan tingkah laku seret ini untuk imej dalam dokumen HTML.

Masalah:

Bagaimana saya boleh menghalang imej pada halaman web saya daripada diseret ?

Jawapan:

Untuk mengelakkan penyeretan imej dalam HTML, anda boleh menggunakan pendekatan berikut:

1. Manipulasi DOM Langsung :

Menggunakan JavaScript, akses elemen imej tertentu melalui ID atau kelasnya dan tetapkan pengendali acara ondragstartnya kepada fungsi yang mengembalikan palsu. Ini secara berkesan membatalkan tindakan seret.

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

2. jQuery:

Jika anda menggunakan perpustakaan jQuery, anda boleh memanfaatkannya keupayaan pengendalian acara. Ikat pengendali acara dragstart kepada semua elemen imej pada halaman dan dalam pengendali acara, halang tindakan lalai untuk melumpuhkan penyeretan.

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

Contoh:

Pertimbangkan kod HTML berikut:

<img src="my-image.jpg" id="my-image">

Menggunakan penyelesaian dengan jQuery, kod JavaScript ialah:

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

Kod ini secara berkesan akan melumpuhkan penyeretan untuk semua elemen imej pada halaman, termasuk yang mempunyai ID "imej saya."

Atas ialah kandungan terperinci Bagaimanakah saya boleh menghalang penyeretan imej dalam HTML?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!