begin process at 2012 05 28 14:17:51
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

Trucs & Astuces

 > PERMETTRE LA SÉLECTION DU TEXTE PAR L'UTILISATEUR

PERMETTRE LA SÉLECTION DU TEXTE PAR L'UTILISATEUR


 Information sur la source

Note :
10 / 10 - par 2 personnes
10,00 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Trucs & Astuces Classé sous :lien, anti clic-droit, sélection, activer, empêcher Niveau :Débutant Date de création :14/02/2011 Date de mise à jour :28/02/2011 02:13:59 Vu / téléchargé :1 830 / 42

Auteur : jdmcreator

Ecrire un message privé
Site perso
Commentaire sur cette source (26)
Ajouter un commentaire et/ou une note

 Description

Dernièrement, j'ai eu l'horreur de me retrouver sur un site où on m'empêchait de sélectionner. J'ai donc désactiver le javascript. On me l'empêchait toujours. Et voici donc, CSS3 offre maintenant la possibilité de désactiver la sélection ! (http://help.dottoro.com/lcrlukea.php)

J'ai donc repris une astuce trouvé sur l'éditeurjavascript qui consistait à être un lien qui permet de réactiver la sélection, et tout ce qui va avec. Mais je l'ai amélioré à en mourrir, et pour l'instant je n'ai pas encore trouvé de code qui résiste au lien. Toutefois certains sont plus difficile que d'autre. J'y viendrai plus loin.

Donc, le code permet de supprimer les méthodes classiques (changement d'événement en "return false"), les nouveaux CSS (::selection et (-moz-/o-/khtml-/webkit-)user-select) et les nouveaux attributs (unselectable), et cc en plus de remettre la valeur css de overflow à sa valeur originale, car oui, des fois, certains la modifie. Deplus, j'ai fait en sorte que lorsque on remet le CSS ::selection à défaut, ce soit la couleur originale et la couleur de texte originale, peu importe le navigateur.

Mais la méthode est en 2 étapes. On met le lien dans la barre d'étape 1 fois et on fait ENTRER = 1 Étape. Normalement, cela suffit. Mais parfois, il faut faire entrer une deuxième étape. Dans ce cas-là, on refait exactement la même chose mais une petit alerte nous demandera de valider. C'est que le script va parcourir TOUS les éléments et va supprimer TOUS les événements qui peuvent utiliser pour empêcher la sélection.

J'ai mis les liens dans la section source en raison du bug des espaces dans les URL.

EDIT : Fourni maintenant avec une extension Safari et la source de cette extension ;)

Source

  • Quelques exemples de site où cela fonctionne en 1 étapes :
  • http://css-tricks.com/examples/DifferentSelectionColors/
  • http://www.editeurjavascript.com/scripts/scripts_autres_2_48.php
  • http://www.editeurjavascript.com/scripts/scripts_autres_2_138.php
  • Un exemple de site où cela fonctionne en 2 étapes :
  • http://javascript.internet.com/page-details/disable-text-selection.html
  • Copier-coller ceci dans la barre d'adresse :
  • javascript:nfc=function(){if(window.selectiongomore==undefined){var css=document.createElement("style");css.type="text/css";css.media="all";try{css.innerHTML="::-moz-selection { background:Highlight ! important;color:HighlightText ! important;visibility:visible !important;}::selection { background:Highlight !important;color:HighlightText ! important;visibility:visible !important}*{-moz-user-select: auto ! important;-o-user-select: auto ! important;-khtml-user-select: auto ! important; -webkit-user-select: auto !important;user-select: auto !important}body{overflow:auto !important}";document.body.appendChild(css)}catch(e){}document.ondragstart=document.body.ondragstart=null;document.oncontextmenu=document.body.oncontextmenu=null;document.onselectstart=document.body.onselectstart=null;document.onclick=null;document.body.onclick=null;document.onmousedown=document.body.onmousedown=null;document.onmouseup=document.body.onmouseup=null;document.onbeforecopy=document.body.onbeforecopy=null;document.onbeforecut=document.body.onbeforecut=null;document.oncopy=document.body.oncopy=null;tag=document.getElementsByTagName("*");for(var i=0;i<tag.length;i++){tag[i].onbeforecopy=null;tag[i].oncopy=null;tag[i].oncontextmenu=null;tag[i].onselectstart=null;tag[i].unselectable="off"}window.selectiongomore=true;alert("partie 1 de l\047opération terminée")}else if(confirm("Vous allez continuer la phase 2 de l\047opération. Avertissement : Cette phase peut empêcher certains scripts sur la page de fonctionner, tel que les applications web. Cliquez sur OK seulement si vous n\047allez pas utiliser la page par la suite. Pour annuler les modifications apporté par l\047outil, vous pouvez réactualiser la page")){tag=document.getElementsByTagName("*");for(var i=0;i<tag.length;i++){tag[i].onmousedown=null;tag[i].onmouseup=null;tag[i].onclick=null;tag[i].onmousewheel=null}alert("partie 2 de l\047opération terminée")}}()
Quelques exemples de site où cela fonctionne en 1 étapes :

http://css-tricks.com/examples/DifferentSelectionColors/
http://www.editeurjavascript.com/scripts/scripts_autres_2_48.php
http://www.editeurjavascript.com/scripts/scripts_autres_2_138.php

Un exemple de site où cela fonctionne en 2 étapes :

http://javascript.internet.com/page-details/disable-text-selection.html


Copier-coller ceci dans la barre d'adresse :



javascript:nfc=function(){if(window.selectiongomore==undefined){var css=document.createElement("style");css.type="text/css";css.media="all";try{css.innerHTML="::-moz-selection { background:Highlight !  important;color:HighlightText !  important;visibility:visible !important;}::selection { background:Highlight  !important;color:HighlightText !  important;visibility:visible !important}*{-moz-user-select: auto !  important;-o-user-select: auto !  important;-khtml-user-select: auto !  important; -webkit-user-select: auto !important;user-select: auto !important}body{overflow:auto !important}";document.body.appendChild(css)}catch(e){}document.ondragstart=document.body.ondragstart=null;document.oncontextmenu=document.body.oncontextmenu=null;document.onselectstart=document.body.onselectstart=null;document.onclick=null;document.body.onclick=null;document.onmousedown=document.body.onmousedown=null;document.onmouseup=document.body.onmouseup=null;document.onbeforecopy=document.body.onbeforecopy=null;document.onbeforecut=document.body.onbeforecut=null;document.oncopy=document.body.oncopy=null;tag=document.getElementsByTagName("*");for(var i=0;i<tag.length;i++){tag[i].onbeforecopy=null;tag[i].oncopy=null;tag[i].oncontextmenu=null;tag[i].onselectstart=null;tag[i].unselectable="off"}window.selectiongomore=true;alert("partie 1 de l\047opération terminée")}else if(confirm("Vous allez continuer la phase 2 de l\047opération. Avertissement : Cette phase peut empêcher certains scripts sur la page de fonctionner, tel que les applications web. Cliquez sur OK seulement si vous n\047allez pas utiliser la page par la suite. Pour annuler les modifications apporté par l\047outil, vous pouvez réactualiser la page")){tag=document.getElementsByTagName("*");for(var i=0;i<tag.length;i++){tag[i].onmousedown=null;tag[i].onmouseup=null;tag[i].onclick=null;tag[i].onmousewheel=null}alert("partie 2 de l\047opération terminée")}}()

 Conclusion

Bon... ce n'est pas l'avancement du siècle. Et il y a encore quelques bugs avec IE mais heureusement ces bugs empêche de supprimer des trucs qu'il ne supporte pas. Mais cela peut être parfois utile pour les sites qui ne comprennent pas encore en compte le respect de l'utilisateur

EDIT : J'ai mis à jour car j'avais oublié le préfixe "javascript:" en plus d'ajouter un zip où le lien est déjà fait pour vous.

 Fichier Zip

Les Membres Club peuvent télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip


 Historique

20 février 2011 15:31:15 :
MAJ
22 février 2011 01:40:40 :
MAJ2
23 février 2011 00:53:43 :
Rajout "javascript:" + ZIP
23 février 2011 00:58:08 :
Bug dans les URL
28 février 2011 02:13:59 :
Extension Safari (+ sa source)

 Sources du même auteur

Source avec Zip JDMATH-MINI.JS : GÉNÉRATION D'EXPRESSION MATHÉMATIQUE
PARSER LES CARACTÈRES HTML D'UNE STRING
Source avec Zip TIMER : SETTIMEOUT & SETINTERVAL AMÉLIORÉS
RÉPÉTER UN VIDÉO YOUTUBE EN JAVASCRIPT À L'AIDE D'UN MARQUE-...
Source avec Zip 20 ASTUCES POUR PROGRAMMEURS JAVASCRIPT AVANCÉS

 Sources de la même categorie

PARSER LES CARACTÈRES HTML D'UNE STRING par jdmcreator
CONSTRUCTION D'UNE TABLE TRIABLE À PARTIR D'UN TABLEAU 2D par phm
Source avec Zip Source avec une capture SUBDIVISER LE RÉSULTAT D'UNE RECHERCHE EN PAGES par kimmp
Source avec Zip TIMER : SETTIMEOUT & SETINTERVAL AMÉLIORÉS par jdmcreator
Source avec Zip Source avec une capture ONGLETS ET CHANGEMENT INSTANTANÉ DE LA LANGUE par william voirol

 Sources en rapport avec celle ci

Source avec Zip EZEDITTABLE par koalyptus
OUTIL DE SÉLECTION par jdmcreator
SIMULER UN TARGET="_BLANK" VALIDE XHTML STRICT par medium69
ENREGISTREUR DE LIENS par benoitmacier
ARBORESCENCE ( À NIVEAUX QUASI ILLIMITÉ ) DE CHECKBOX AVEC L... par Grafiii

Commentaires et avis

Commentaire de macsou01 le 14/02/2011 21:59:02

C'est vrai que les sites qui utilisent des méthodes pour empêcher la sélection ou le clic droit sont assez frustrants.
Merci bien pour ce petit bout de code à garder dans un marque-page ! :)

Commentaire de lassie14 le 21/02/2011 01:37:33 10/10

superbe source merci beaucoup

j'ai deja fait mon marque page pour un accès rapide

Commentaire de arta le 21/02/2011 07:41:01

Bonjour tous
Voyons voir cet utilitaire qui parait bien sympathique. :)

Commentaire de fs074995 le 21/02/2011 08:46:27

Bonjour
Ce petit bout de code me semble intéressant dans un nombre
de cas non négligeable.
Comme novice (très) j'ai cependant un petit problème de compréhension.
Quand je copie le code dans la barre d'adresse, j'ai une réponse du genre :Request-URI Too Large
Ou est ce que je bug?
Merci  

Commentaire de emilia123 le 21/02/2011 09:06:13

bonjour,

J'aurais une petite remarque... pour pouvoir facilement l'insérer en tant que raccourci, il serait plus facile si il n'y avait pas des " et des ' mélangés.
ex : qu'il n'y ait que des ' pour encadrer les textes, et un \' si on doit afficher un ' au milieu du texte.

Parce que pour en faire un lien dans les favoris il faut reprendre un peu le script et tout passer soit en " soit en '..

mais sinon, c'est pas mal en effet..

bonne continuation.

EM.

Commentaire de Heirem le 21/02/2011 11:23:19 10/10

Excellent !
A la fois efficace et ... pédagogique dans le contenu !
Merci.

Commentaire de jdmcreator le 22/02/2011 01:45:27

@Macsou01, Lassie14, ARTA et Heirem : Merci beaucoup, vos commentaires me font plaisir =)

@fs074995 : C'est étrange. Il semble dire que l'adresse est trop longue. Quel navigateur utilise-tu ?

@Emilia123 : J'ai mis à jour, veux-tu voir les modifications ?

Commentaire de lassie14 le 22/02/2011 05:22:35

@fs074995 : est tu sur de ne pas entrer ça dans la barre de recherche ? au lieu de la barre d'adresse ??

@Emilia123 : tu fais comment parceque tu ne devrais pas avoir de problème

Commentaire de arta le 22/02/2011 07:46:32

Bonjour
Donc j'ai entré le seul lien valable : http://www.editeurjavascr ipt.com/scripts/scripts_autres_2_138.php qui rencoie sur google, le bon lien étant : http://www.editeurjavascript.com/scripts/scripts_autres_2_138.php

Résultat vec FF, Chrome, Safari et Opéra :
Request-URI Too Large
The requested URL /search... is too large to process.
Avec IE:  
Internet Explorer ne peut pas afficher cette page Web

Commentaire de emilia123 le 22/02/2011 07:57:20

bonjour,


pour pouvoir l'utiliser de maniere simple il faut créer un fichier lien.html et dedans y ajouter :
<a href='javascript:..........tout le code proposé...........'>Remettre la selection</a>
une fois enregistrée, ouvrez cette page avec firefox, et glissez le lien dans votre barre des favoris (ou dans marques pages).

cela devrait fonctionner.

C'est pour cela que si il y avait en meme temps des ' et des " la mise en url dans un vrai lien aurait généré des problèmes.

EM.

Commentaire de lassie14 le 22/02/2011 08:07:34

ben moi perso
j'ai fait un nouveau favoris
ensuite j'ai éditer ce favoris pour y mettre le script comme adresse et le nom que je voulais
et il me suffit quand je suis sur le site de cliquer sur mon favoris et boum plus de sécu ça marche quoi

je suis avec chrome

Commentaire de arta le 22/02/2011 08:12:15

Bonjour emilia123

Franchement je comprend pas la manip je fais une page html avec ce que tu donnes et l'enregistre en favori, anti.html, OK.
Ensuite j'ouvre le lien http://www.editeurjavascript.com/scripts/scripts_autres_2_138.php et là je fais quoi ???
Si je passe par les favoris et appelle le favori créé, il m'ouvre cette page html avec comme adresse file///C:/anti.html.


Commentaire de arta le 22/02/2011 08:17:28

Bonjour lassie14

En plus le code proposé n'est plus le même qu'hier.
Ton fichier html, tu y mets quoi dedans au juste ?
Tu dis que tu cliques sur ton favori et hop !
Mais si ce favori est un lien html, il ouvre automatiquement ce fichier ?

Commentaire de emilia123 le 22/02/2011 08:27:52

oula doucement on reprend....

ce n'est pas le fichier qu'il faut mettre en favoris, mais uniquement le lien qui commence par 'javascript:' + tout le code donné par Jdmcreator.

Si tu ne comprends pas la technique que je propose, utilise celle de Lassie14

EM

Commentaire de Heirem le 22/02/2011 11:19:33

Attention copiant le code à supprimer auparavant les retours à la ligne ;)
Une modification préalable dans un notepad est bienvenue :)

Commentaire de arta le 22/02/2011 11:37:48

RE emilia123

Tu dis:
ce n'est pas le fichier qu'il faut mettre en favoris
mais avant tu dis:
pour pouvoir l'utiliser de maniere simple il faut créer un fichier lien.html et dedans y ajouter :<a href='javascript:..........tout le code proposé ...........'>Remettre la selection</a>

Quand je suis sur cette page, je fais quoi au juste ???
Parce que entrer dans la barre de titre le bout de code et faire entrer emmène les alertes données plus haut.

Commentaire de jdmcreator le 23/02/2011 00:56:12

Bonjour à tous,

Merci encore pour vos commentaire.

@ARTA : J'ai mis encore à jour. J'avais en effet oublié le préfixe "javascript:" dans la dernière mise à jour et j'ai rajouter un ZIP avec un lien. Il te suffit de le glisser dans la barre des signets ;)

Commentaire de jdmcreator le 23/02/2011 01:00:47

Encore @ARTA : Il y a un bug sur Codes-Sources qui fait que des espaces sont parfois rajouter dans les URL. Je les ai donc déplacé dans la section "source"

@Heirem : J'avoue ne pas comprendre de quoi tu parles xD ?

Commentaire de arta le 23/02/2011 07:03:10

Bonjour jdmcreator

C'est sympa ce .zip seulement dedans tu dis comment faire glisser le lien.html dans les favoris mais pas comment s'en servir.
Quand on est sur une page qui bloque le clic, on fait quoi au juste ?

Commentaire de emilia123 le 23/02/2011 07:31:10

@ARTA : quand on est sur une page qui bloque le clic bin tu cherches un script qui te débloque le clic... ici c'est un script qui débloque la sélection via du CSS.
Si tu es sur une page qui bloque la sélection par contre, il faut te lever de sa chaise, faire 3 tours sur toi meme, sauter 3 fois en l'air, taper dans tes mains, et ensuite seulement (sinon ca ne marche pas) tu cliques sur le favoris que tu as ajoutés via la méthode proposée.

Faut faire une petit effort à un moment :(

Autre méthode (si les gens ne comprennent pas le drag & drop) :
1) ouvrir le fichier HTML contenu dans le zip (ca c'est dur)
2) faire clic droit (ca c'est facile) sur le lien
3) et (ca c'est le plus dur) sélectionner "ajouter au favoris" (pour IE) ou "marque page sur ce lien" (firefox)



EM

Commentaire de arta le 23/02/2011 07:50:49

RE

Je trouve que tu manques de respect ........
C'est bon gardez vos codes.

Commentaire de emilia123 le 23/02/2011 08:22:43

désolée si tu le prend mal.

Alors pour essayé de t'aider encore un peu :
une fois le lien ajouté aux favoris, il suffit de cliquer sur ce favoris quand tu es sur une page qui bloque la selection.

Est ce qu'il y a encore quelque chose qui t'aiderait?

EM.

Commentaire de arta le 23/02/2011 08:25:56

RE

1) ouvrir le fichier HTML contenu dans le zip (ca c'est dur)
2) faire clic droit (ca c'est facile) sur le lien
3) et (ca c'est le plus dur) sélectionner "ajouter au favoris" (pour IE) ou "marque page sur ce lien" (firefox)

C'est le lien qu'il faut rajouter aux favoris, pas directement la page html.
Maintenant ça fonctionne, je te remercie !

Commentaire de Heirem le 24/02/2011 23:30:57

Désolé de répondre tardivement.
Ce que je voulais dire c'est que ce code s'utilise comme une adresse URL.
Que ce soit en favoris ou pas.
Il faut juste faire attention qu'aucun retour à la ligne soit présent dans ce code.
C'est tout !
;o)

Commentaire de jdmcreator le 24/02/2011 23:57:36

@Heirem : En effet, mais je les ai supprimés dans la dernière mise à jour ;)

Sinon, j'ai remarqué que l'URL ne peut être placé dans les favoris dans Safari, seulement une portion est rajouté et cela cause une erreur de syntaxe. J'essaye donc de crÉer une extension pour ce navigateur ;) Je vous tiendrai au courant :P

Commentaire de jdmcreator le 28/02/2011 02:16:59

Bonjour, j'ai mis à jour avec une extension Safari, puisque l'ajout du lien dans les favoris est impossible.

Avantages :

- Style CSS chargés automatiquement
- Button d'accès direct, qui fonctionne de la même façon que le lien normal
- Compressé pour n'avoir que les fonctions utiles à Safari
- Plus résistant aux futures attaques contre ce script
- Installation en 1-click ;)

Pour l'installer, ouvrir le fichier "lien.safariextz"

 Ajouter un commentaire


Discussions en rapport avec ce code source dans le forum

cliquer pour activer un lien [ par survivor ] voici le sript que j'ai:[SCRIPT]&lt;html&gt;&lt;head&gt;&lt;SCRIPT LANGUAGE="JavaScript"&gt;clic = false;&lt;/SCRIPT&gt;&lt;/head&gt;&lt;body&gt;&lt;! Ouvrir un fichier texte sous Notepad avec un lien... [ par kennylingus ] Bonjour !Je cherche à savoir s'il est possible d'ouvrir un fichier texte (*.txt) sous un éditeur de texte (exemple notepad) à partir d'un simple lien renvoi hypertexte [ par psycomel ] Bonjour, comment faire pour renvoyer par un lien hypertexte au milieu d'une page. pour ceux qui n'auraient pas compris, je clike sur un lien au haut d popup par lien image [ par morbidecourgette ] bonjour a tous , j ai bien cherche ,j y arrive po :Pvoila je voudrai savoir le code pour faire un popup en cliquant sur une image, et je voudrais qu e Récupération de code sur une sélection [ par marlysa34 ] Bonjour;J'ai un problème de code, j'ai récupéré celui-ci sur une page web. Le problème est le suivant : quand je clique sur un smileys l'adresse du sm Lien pour changer de navigateur [ par thebmxeur ] Slt.J'aimerais savoir comment (si c'est possible) créé un lien qui ouvre un fenetre dans un navigateur diférent de celui qui contient le lien (par ex: aide onclick [ par EFFACEUR ] BonjourJ'aurais aimé savoir si il serait possible de mettre ONCLICK dans une iframe :&lt;iframe border=0 frameborder=0 height=60 width=480 name="publi lien dynamique [ par mlelorra ] salutj'ai un problème qui a l'air vraiment tout betej'ai un lien avec &lt;a href=...&gt;et j'aimerais que le lien soit "dynamique", c'est a dire que l Couleur lien actif [ par seabird ] Salut,J'ai une page principal.html avec une iframe. Je veux donner une couleur au lien actif de la page principal (par exemple rouge) qui appelle une


Nos sponsors


Sondage...

Comparez les prix

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

A découvrir



 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 1,482 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales