Comment désactiver le code du clic droit en HTML

Comment implémenter le code pour désactiver le clic droit de la souris en HTML

Dans le développement Web, la protection des droits d'auteur de la page est un élément crucial. Afin d'empêcher des tiers de copier, télécharger ou prendre des captures d'écran du contenu Web, nous pouvons utiliser certains moyens techniques pour limiter le comportement des utilisateurs. Parmi eux, la désactivation de la fonction clic droit est une méthode simple et efficace. Ce qui suit présentera la méthode d'implémentation du code permettant de désactiver le clic droit de la souris en HTML.

1. Utiliser le code JavaScript

Dans les documents HTML, nous pouvons utiliser le code JavaScript pour désactiver la fonction du bouton droit de la souris. Les étapes spécifiques de mise en œuvre sont les suivantes :

Ajoutez le code JavaScript suivant dans le document HTML : document.oncontextmenu = function(){

return false; } </script&gt ;

Dans l'extrait de code ci-dessus, document.oncontextmenu est une fonction de gestion d'événements, qui sera appelée lorsque le clic droit est déclenché. L'instruction return false empêchera le menu contextuel par défaut d'apparaître, obtenant ainsi l'effet de désactiver le clic droit. 2. Utiliser les fonctionnalités HTML5

En HTML5, un nouvel attribut est fourni : oncontextmenu. Cette propriété peut être utilisée pour désactiver la fonctionnalité de clic droit. Cette méthode est plus simple que l'implémentation de JavaScript. Les étapes d'implémentation spécifiques sont les suivantes :

Ajoutez le code suivant dans le document HTML :

Dans l'extrait de code ci-dessus. , utilisez l'attribut oncontextmenu et définissez sa valeur pour qu'elle renvoie false. Cela désactivera le comportement par défaut du bouton droit de la souris. Il est à noter que cette méthode n'est applicable qu'aux versions HTML5 et supérieures.

3. CSS pour désactiver le bouton droit de la souris

En plus des deux méthodes ci-dessus, nous pouvons également utiliser des feuilles de style CSS pour désactiver le bouton droit de la souris. Les étapes spécifiques de mise en œuvre sont les suivantes :

Ajoutez le code suivant dans le fichier de feuille de style : body { -webkit-touch-callout: none / iOS Safari /

-webkit-user-select: none; /* Chrome/Safari/Opera */ -khtml-user-select: none; /* Konqueror */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; /* Non-prefixed version, currently not supported by any browser */ }

user; dans le code ci-dessus L'attribut -select empêchera l'utilisateur de sélectionner du texte, désactivant ainsi indirectement le clic droit. Il convient de noter que cette méthode désactive non seulement la fonction de clic droit, mais désactive également la fonction de sélection de texte avec la souris.

Pour résumer, nous pouvons utiliser JavaScript, HTML5 et CSS pour implémenter la fonction de désactivation du bouton droit de la souris. En fonction des différents besoins, différentes méthodes de mise en œuvre peuvent être choisies. Dans le même temps, vous devez également faire attention aux éventuels problèmes de compatibilité et aux restrictions d’utilisation pour garantir l’affichage normal et la mise en œuvre des fonctions de la page.