hogyan lehet letiltani a jobb klikk a képekre a jQuery használatával
az egyik korábbi hozzászólásomban már megvitattuk, hogyan lehet letiltani a CTRL+U, a CTRL+C, és jobb egérgombbal kattintani egy weboldalra, és a mai bemutató arról szól, hogyan lehet letiltani a jobb egérgombbal való kattintást és húzni a képeket a jQuery segítségével bármely weboldalon.
gyakran kapok kéréseket a blogger barátaimtól és ügyfeleimtől, hogy biztosítsam a fotókat a webhelyükön, és megakadályozzam, hogy az emberek letöltsék vagy elmentsék őket. Legtöbbjük azt akarja, hogy frissítsem a webhelyet, hogy elkerüljék a felhasználók jobb kattintását a képre, és mentsék a képet, vagy húzzák a képet a számítógépükre vagy alkalmazásukra, például a Photoshopra.
Oké, de miért tiltsa le a jobb klikkelést és húzza a képeket a blogjában vagy webhelyén?
nincs különösebb oka ennek. Személy szerint nem javaslom ennek a szkriptnek a használatát a jobb egérgombbal történő képek letiltásához, mert ez csökkenti a felhasználói élmény minőségét. Sőt, sok felhasználó számára nagyon bosszantó lenne. Ne feledje, hogy webhelyének fő célja az, hogy értéket nyújtson a felhasználók számára.
még akkor is, ha ismeri a jQuery és a CSS szelektorokat, szerkesztheti a szkriptet, hogy letiltsa vagy engedélyezze a jobb egérgombbal történő kattintást és húzást bármilyen HTML elemen. Letilthatja a jobb egérgombbal a képeket egy adott összetevő speciális osztályával.
hogyan kell hozzáadni a szkriptet?
ha hozzá szeretné adni ezt a szkriptet a blogjához, akkor itt van egy szkript, amellyel letilthatja a jobb egérgombbal a képek húzására. Ez a szkript a jQuery-n alapul, de a feltétel az, hogy a blogodnak telepítenie kell egy jQuery plugint. Ha nem, adja hozzá az alábbi jQuery plugint a </head> címke fölé blogjában vagy webhelyén.
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>itt az ideje, hogy hozzáadja a jQuery szkriptet, amely letiltja a jobb egérgombbal történő kattintást és a képek húzását a blog webhelyén. Csak annyit kell tennie, hogy hozzáadja az alábbi szkriptet a </body> címke fölé a blog/webhely HTML-jében.
<script type="text/javascript">$(document).ready(function(){// this part disables the right click$('img').on('contextmenu', function(e) {return false;});//this part disables dragging of image$('img').on('dragstart', function(e) {return false;});});</script>ez az. Most látogasson el a honlapon, és próbálja meg a jobb egérgombbal bármelyik képre, és nézze meg, hogyan működik ez a szkript!
van más módja annak?
Ezenkívül itt van egy másik módszer, amellyel letilthatja a jobb egérgombbal a képre a Javascript használatával (Igen, Javascript. Nem jQuery). Ha nem szeretné hozzáadni a fenti jQuery szkriptet a blogjához, vagy csak a jobb egérgombbal szeretne letiltani, nem pedig húzni, van egy másik módja.
a fenti szkriptből azonban eltávolíthatja a drag letiltási funkciót is, de egyszerűen használhatja az alábbi Javascript kódot, amelyet be kell illesztenie a </head> címke előtt a blogjában vagy a webhely HTML-jében.
<script type='text/javascript'>//<!]></script>Önnek ajánlott:
hogyan lehet letiltani a szöveg kiválasztását egy weboldalon CSS használatával