så här inaktiverar du högerklicka på bilder med jQuery
i ett av mina tidigare inlägg diskuterade vi redan hur man inaktiverar CTRL+U, CTRL+C och högerklickar på en webbsida, och dagens handledning handlar om hur man inaktiverar högerklicka och dra på bilder med jQuery på vilken webbsida som helst.
jag får ofta förfrågningar från mina bloggvänner och klienter för att säkra bilderna på sina webbplatser och förhindra att människor laddar ner eller sparar dem. De flesta av dem vill att jag ska uppdatera webbplatsen för att undvika användarnas högerklicka på bilden och spara bilden eller dra bilden till sin dator eller program som Photoshop.
okej, men varför ska du inaktivera högerklicka och dra på bilder i din blogg eller webbplats?
det finns ingen särskild anledning för dig att göra detta. Personligen rekommenderar jag inte att du använder det här skriptet för att inaktivera högerklickbilder eftersom det minskar användarupplevelsen. Dessutom skulle det vara mycket irriterande för många användare. Kom ihåg att din webbplats huvudsyfte är att ge dina användare värde.
även om du är bekant med lite jQuery-och CSS-väljare kan du redigera skriptet för att inaktivera eller aktivera högerklicka och dra på alla typer av HTML-element. Du kan inaktivera högerklicka på bilder med en speciell klass av en viss komponent.
Hur lägger man till skriptet?
om du vill lägga till det här skriptet till din blogg, så här är ett skript som du kan använda för att inaktivera högerklicka på dra på bilder. Detta skript är verk baserade på jQuery, men villkoret är att din blogg måste ha en jQuery plugin installerat. Om inte, lägg till nedanstående jQuery-plugin ovanför taggen </head> i din blogg eller webbplats.
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
nu är det dags att lägga till jQuery-skriptet som inaktiverar högerklicka och dra på bilder på din bloggwebbplats. Allt du behöver göra är att lägga till nedanstående skript ovanför taggen </body> i din blogg/webbplatsens HTML.
<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>
det är det. Besök nu din webbplats och försök högerklicka på vilken bild som helst och se hur det här skriptet fungerar!
finns det ett annat sätt att göra det?
dessutom är här ett annat sätt som du kan använda för att inaktivera högerklicka på bilden med Javascript (Ja, Javascript. Inte jQuery). Om du inte vill lägga till ovanstående jQuery-skript i din blogg eller bara vill högerklicka för att vara inaktiverad och inte dra, finns det ett annat sätt.
du kan dock ta bort dragavstängningsfunktionen från ovanstående skript, men du kan helt enkelt använda Javascript-koden nedan som du måste klistra in innan </head> tagg i din blogg eller webbplatsens HTML.
<script type='text/javascript'>//<!]></script>
rekommenderas för dig:
så här inaktiverar du val av text på en webbsida med CSS