html melarang menyeret

Dalam reka bentuk web, HTML (Hypertext Markup Language) sentiasa menjadi bahagian yang sangat penting. Ia membolehkan pembangun mencipta dan memaparkan kandungan web, berkongsi dan mengaksesnya di Internet. Walau bagaimanapun, dalam pembangunan web sebenar, elemen atau atribut tertentu dalam HTML mungkin menyebabkan beberapa kesan buruk dan masalah pengalaman pengguna. Contoh yang jelas ialah kes menyeret elemen, dan sebenarnya HTML menyediakan cara untuk melumpuhkan tingkah laku menyeret ini, sekali gus meningkatkan pengalaman pengguna dan keselamatan halaman.

Mengapa perlu menyeret elemen HTML dilarang?

Dalam HTML, beberapa elemen (seperti , , , dll.) boleh dialihkan dengan menyeret tetikus. Walaupun elemen menyeret boleh menyediakan pengguna dengan operasi yang mudah, kadangkala ia boleh menyebabkan beberapa masalah, seperti: ralat menyeret, pergerakan tidak sengaja atau pemadaman elemen penting, yang menjejaskan reka letak halaman web juga boleh menyebabkan kebocoran kad kredit dan maklumat peribadi.

Sebaliknya, beberapa program berniat jahat (seperti pancingan data dan pengiklanan penipuan) akan memaparkan kandungan palsu kepada pengguna dengan menggunakan fungsi seret elemen HTML dan mendorong pengguna untuk mengklik, seterusnya menyebabkan kehilangan data dan ancaman Keselamatan pengguna . Oleh itu, melumpuhkan gelagat menyeret elemen HTML boleh memastikan keselamatan dan pengalaman pengguna halaman dalam beberapa kes.

Bagaimana untuk melumpuhkan penyeretan elemen HTML?

Dalam HTML, anda boleh mengawal sama ada elemen boleh diseret melalui atribut "boleh diseret". Nilai lalai atribut ini ialah "auto", yang bermaksud elemen itu boleh diseret. Walau bagaimanapun, penyeretan elemen boleh dilumpuhkan dengan menetapkan atribut "boleh diseret" kepada "palsu".

Contoh kod berikut menunjukkan cara menggunakan atribut "boleh diseret":

<img src="example.png" draggable="false">

<a href="example.com" draggable="false">example</a>

<input type="text" value="example" draggable="false">

Dalam kod contoh di atas, nilai atribut "boleh diseret" masing-masing ditetapkan kepada "salah", untuk dan Dengan cara ini, elemen ini tidak akan diseret lagi.

Anda boleh melumpuhkan penyeretan untuk semua elemen dalam keseluruhan halaman melalui CSS, seperti yang ditunjukkan di bawah:

* {
  -webkit-user-drag: none;
  -moz-user-drag: none;
  -ms-user-drag: none;
  user-drag: none;
}

Dalam kod di atas, gunakan atribut "seret pengguna" CSS dan awalan penyemak imbas, kerana Menyeret dinyahdayakan untuk semua elemen.

Perlu diambil perhatian bahawa atribut "boleh diseret" hanya digunakan pada HTML5, jadi ia mungkin tidak berfungsi dalam versi HTML yang lebih awal. Selain itu, sesetengah penyemak imbas (seperti Firefox, Chrome dan Safari) mungkin mengabaikan atribut "boleh diseret" dalam keadaan tertentu. Mengambil Chrome sebagai contoh, apabila format fail sumber imej yang ditentukan tidak menyokong "BitmapImage", ia tidak akan bertindak balas kepada peristiwa seretan.

Kesimpulan

Melumpuhkan gelagat menyeret elemen HTML boleh membantu meningkatkan keselamatan dan pengalaman pengguna halaman. Apabila melaksanakan fungsi ini, anda juga perlu memberi perhatian kepada beberapa masalah yang berpotensi, seperti isu keserasian dengan sesetengah penyemak imbas atau sama ada operasi berkaitan seretan lain terjejas. Walau bagaimanapun, apabila mempertimbangkan untuk melumpuhkan menggunakan atribut "boleh diseret", anda mesti menimbang kebaikan dan keburukan setiap kaedah dan memastikan bahawa kebolehgunaan, keselamatan dan pengalaman pengguna halaman adalah seimbang.

Atas ialah kandungan terperinci html melarang menyeret. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!