Slik deaktiverer et bilde med jQuery

Slik deaktiverer et bilde med jQuery


Bildene på nettet er fritt vilt for alle som ønsker å kopiere dem. Nettlesere kommunisere direkte med webservere, og bilder som vises på en webside er faktisk lagret i nettleserens cache. Noen nettstedeiere forsøker å hindre brukere fra å kopiere bilder på sidene sine ved å deaktivere nettleserkontekstmenyen med jQuery. En kontekstmeny med valg som "Kopier" og "Lagre som" vises når du høyreklikker et bilde på en webside. Du kan ikke hindre alle brukere fra å kopiere bildene dine, men du kan stoppe dem som ikke forstår jQuery Javascript bibliotekfunksjoner.

Bruksanvisning

1 Start Notepad eller en HTML-editor.

2 Åpne et HTML-dokument og lim inn følgende kode inn i dokumentets hoveddel:

<Img id = "image1" alt = "image1" />

<Input type = "button" value = "Deaktiver Image" onclick = "disableImage ( 'image1')" />

Erstatt "myImage.gif" med navnet på et bilde på datamaskinen eller nettadressen til en bildefil som ligger på Internett. Knappen under bildet kaller "disableImage" -funksjonen, som deaktiverer bildet. Det går også bildets ID-verdien til funksjonen.

3 Legg denne funksjonen til dokumentets script seksjon:

funksjon disableImage (id) {

Var imageObject = "#" + id;

Var return = false;

$ (ImageObject) .bind ( "contextmenu", function () {

tilbake return;

});

}

Denne funksjonen henter en referanse til bildet og bruker jQuery er "bind" metoden satt bildets contextmenu eiendom. Ved å sette verdien til "false" du hindre besøkende fra høyreklikke på bildet og få tilgang til kontekstmenyen.

4 Lagre dokumentet og deretter vise den i nettleseren din. Høyreklikk på bildet. En hurtigmeny vises som lar deg kopiere eller lagre bildet.

5 Klikk på "Disable Image" knappen på websiden, deretter høyreklikker du på bildet igjen. Ingen kontekstmenyen vises. Du kan ikke kopiere eller lagre bildet.

Hint

  • Ikke bekymre seg for brukere som ikke er i stand til å høyreklikke andre områder på siden din for å vise kontekstmenyen. JQuery kode som vist i trinnene deaktiverer menyen for bildet som "Deaktiver Image" knappen går til funksjonen. Hvis du foretrekker å deaktivere bildet når siden lastes, kaller Javascript-funksjonen i HTML-dokumentet side for last event.