Interdire le copier/coller dans un formulaire sans javascript

septembre 7th, 2013 | by | html/css

Sep
07

Ayant des problèmes avec des adresses mails erronées, un client a voulu que les personnes s'inscrivant sur son site doivent valider leur adresse tout en interdisant le copier/coller car sinon cela ne servait pas à grand chose.

J'ai donc cherché une méthode simple et à ma plus grande surprise cela existe en html sans avoir besoin de recourir au javascript !

oncopy="return false;" pour empêcher la copie
oncut="return false;" pour empêcher de couper
onpaste="return false;" pour empêcher de coller

1
2
<label>Adresse e-mail :</label><input name="email" type="text" oncopy="return false;" oncut="return false;" />
<label>Confirmation de l'adresse e-mail :</label><input name="emailconfirm" type="text" onpaste="return false;" />

Le bémol c'est que ces attributs viennent de Microsoft… et donc non standards… mais cela fonctionne sur la plus part des navigateurs.

Si vous voulez connaitre tous les évènements-attibuts : http://reference.sitepoint.com/html/extended-event-attributes/oncopy

Après vous pouvez faire ça en jquery :

1
2
3
4
5
6
7
8
9
$("#email").bind('copy', function() {
alert('copy behaviour detected!')
});
$("#email").bind('cut', function() {
alert('cut behaviour detected!')
});
$("#emailconfirm").bind('paste', function() {
alert('paste behaviour detected!')
});

No Comments »