Comment désactiver la sélection de texte, couper, copier, coller et faire un clic droit sur une page Web

Comment désactiver la sélection de texte, couper, copier, coller et faire un clic droit sur une page Web

Si vous souhaitez empêcher les autres de voler du contenu sur votre site Web, vous pouvez le faire dans une certaine mesure à l'aide de CSS, JavaScript et jQuery. Dans cet article, vous apprendrez comment désactiver la sélection de texte, couper, copier, coller et cliquer avec le bouton droit sur une page Web.





Désactiver la sélection de texte à l'aide de CSS ou JavaScript

Vous pouvez désactiver la sélection de texte d'une page Web complète ou d'une partie de la page à l'aide de CSS, JavaScript ou jQuery.





convertir pdf en noir et blanc

Comment désactiver la sélection de texte de la page Web complète à l'aide de JavaScript

Utilisation onmousedown et onselectstart attributs d'événement avec le corps pour désactiver la sélection de texte d'une page Web complète. Ces événements remplacent le comportement par défaut des navigateurs.









This is the title of the web page



Founded in 2007, MUO has grown into one of the largest online technology publications on the web.
Our expertise in all things tech has resulted in millions of visitors every month and hundreds of thousands of fans on social media.
We believe that technology is only as useful as the one who uses it.
Our aim is to equip readers like you with the know-how to make the most of today's tech, explained in simple terms that anyone can understand.
We also encourage readers to use tech in productive and meaningful ways.


Comment désactiver la sélection de texte d'une partie de la page Web à l'aide de JavaScript

Utilisation onmousedown et onselectstart attributs d'événement avec le HTML tag sur ceux sur lesquels vous souhaitez désactiver la sélection de texte. Dans l'exemple ci-dessous, la sélection de texte est désactivée pour le 2e div étiqueter.





This is the title of the web page



Text selection is enabled for this text.


Text selection is disabled for this text.


Comment désactiver la sélection de texte de la page Web complète à l'aide de CSS

Utilisez le sélection par l'utilisateur Propriété CSS avec le corps pour désactiver la sélection de texte d'une page Web complète. Pour certains navigateurs, vous devez ajouter une extension avant sélection par l'utilisateur . Voici la liste complète des propriétés pour tous les navigateurs :



  • Chrome , Opéra : sélection par l'utilisateur
  • Safari : -webkit-user-select
  • Mozilla : -moz-user-select
  • IE 10+ : -ms-user-select

Vous devez définir toutes ces propriétés sur aucune pour désactiver la sélection de texte.





This is the title of the web page

body {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}




Founded in 2007, MUO has grown into one of the largest online technology publications on the web.
Our expertise in all things tech has resulted in millions of visitors every month and hundreds of thousands of fans on social media.
We believe that technology is only as useful as the one who uses it.
Our aim is to equip readers like you with the know-how to make the most of today's tech, explained in simple terms that anyone can understand.
We also encourage readers to use tech in productive and meaningful ways.


Comment désactiver la sélection de texte d'une partie de la page Web à l'aide de CSS

Utilisation sélection par l'utilisateur Propriété CSS avec le HTML tag sur ceux dont vous souhaitez désactiver la sélection de texte. Vous pouvez cibler ces éléments HTML à l'aide d'une classe ou d'un ID. Dans l'exemple ci-dessous, la sélection de texte est désactivée pour le 2e div étiqueter. Ici, la classe est utilisée pour cibler la 2e div.





En rapport: 10 exemples de code CSS simples que vous pouvez apprendre en 10 minutes





This is the title of the web page

.disable-text-selection {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}




Text selection is enabled for this text.


Text selection is disabled for this text.


Comment désactiver couper, copier et coller à l'aide de JavaScript

Vous pouvez désactiver couper, copier et coller à l'aide de la oncut , oncopie , et en pâte attributs d'événement avec les éléments HTML cibles. Si vous souhaitez désactiver couper, copier et coller pour la page Web complète, vous devez utiliser ces attributs d'événement avec la balise body. Vous pouvez également désactiver le glisser-déposer en utilisant faire glisser et ondrop attributs d'événement. Dans l'exemple ci-dessous, couper, copier, coller, faire glisser et déposer sont désactivés pour la balise d'entrée.





En rapport: Qu'est-ce que JavaScript et comment ça marche ?





This is the title of the web page



Cut, Copy, and Paste is disabled for the below input element.

type='text'
onselectstart='return false'
oncut='return false'
oncopy='return false'
onpaste='return false'
ondrag='return false'
ondrop='return false'
/>

Comment désactiver couper, copier et coller à l'aide de jQuery

Vous pouvez désactiver couper, copier et coller sur une page Web à l'aide de jQuery lier() fonction. Dans le lier() fonction, vous devez spécifier les événements couper, copier et coller qui sont déclenchés lorsqu'un utilisateur essaie de couper, copier ou coller quoi que ce soit sur la page Web. Assurez-vous d'intégrer la balise de script dans la section head pour charger jQuery avant de l'utiliser.

En rapport: Apprenez à créer un élément dans jQuery





This is the title of the web page




Cut, Copy, and Paste is disabled for the complete web page.



$(document).ready(function() {
$('body').bind('cut copy paste', function(event) {
event.preventDefault();
});
});


Comment désactiver le clic droit sur une page Web à l'aide de JavaScript

Vous pouvez désactiver le clic droit sur votre page Web en utilisant un menu contextuel événement et en incluant 'return false' dans le gestionnaire d'événements.





This is the title of the web page



Right Click is disabled for the complete web page.


document.oncontextmenu = new Function('return false');


Comment désactiver le clic droit sur une page Web à l'aide de jQuery

Vous pouvez désactiver le clic droit sur votre page Web en utilisant le menu contextuel un événement.





This is the title of the web page




Right Click is disabled for the complete web page.


$(document).bind('contextmenu',function(e){
return false;
});


Protégez votre site Web contre les cybercriminels

Les cybercriminels utilisent tous les outils possibles à leur disposition pour voler des données, spammer des sites Web ou pirater des informations sensibles à partir de pages protégées. Il est impératif d'inclure une couche de sécurité sur votre site Web pour les empêcher. Le spam des formulaires de sites Web est l'une des attaques les plus courantes de nos jours. Essayez d'ajouter la validation CAPTCHA aux formulaires de votre site Web pour éviter ces attaques de spam.

pouvez-vous supprimer une offre sur ebay
Partager Partager Tweeter E-mail Créer un formulaire de validation CAPTCHA à l'aide de HTML, CSS et JavaScript

Sécurisez vos sites Web avec la validation CAPTCHA.

Lire la suite
Rubriques connexes
  • La programmation
  • Développement web
  • jQuery
  • CSS
A propos de l'auteur Yuvraj Chandra(60 articles publiés)

Yuvraj est un étudiant de premier cycle en informatique à l'Université de Delhi, en Inde. Il est passionné par le développement Web Full Stack. Quand il n'écrit pas, il explore la profondeur de différentes technologies.

Plus de Yuvraj Chandra

Abonnez-vous à notre newsletter

Rejoignez notre newsletter pour des conseils techniques, des critiques, des ebooks gratuits et des offres exclusives !

Cliquez ici pour vous abonner