Récupérer un texte sélectionné à la souris par l'utilisateur

**rambc** · 21/03/2012, 12h20

Bonjour,
je vais crére un dictionnaire mathématique illustré et dynamique pour des élèves de niveau Collège ou Lycée.

Afin de rendre ce dictionnaire efficace, j'aimerais qu'il soit possible de sélectionner du texte et, à l'aide d'un raccourci comme la [?], récupérer via JavaScript ce qui a été sélectionné par l'utilisateur. Est-ce possible ?

Tant que j'y suis, imaginons que l'utilisateur sélectionne un objet comme une image, peut-on récupérer le code HTML correspondant qui cacherait des métadonnées via par exemple des micros datas ?

**Rachel** · 22/03/2012, 06h17

Bonjour

Il est effectivement possible de récupérer le texte sélectionné en Javascript.
Voici une fonction en Javascript (pas en jQuery

) qui fonctionne sur tous les navigateurs :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
function getSelected() {
	if(window.getSelection) { return window.getSelection(); }
	else if(document.getSelection) { return document.getSelection(); }
	else {
		var selection = document.selection && document.selection.createRange();
		if(selection.text) { return selection.text; }
		return false;
	}
	return false;
}

**rambc** · 22/03/2012, 12h42

Merci beaucoup pour ce code qui va m'être très utile !

**rambc** · 22/03/2012, 12h57

Question toute bête : comment appeler la fonction lorsque je presse par exemple MAJ suivi de , ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
 
    <script>
function getSelected() {
    if(window.getSelection){
        return window.getSelection();
 
    } else if(document.getSelection){
        return document.getSelection();
 
    } else {
        var selection = document.selection && document.selection.createRange();
 
        if(selection.text) {
            return selection.text;
        }
        return false;
    }
 
    return false;
}
    </script>
  </head>
 
  <body>
 
Voilà un bout de texte pout tester ce qui est sélectionné.
 
  </body>
</html>

**rambc** · 22/03/2012, 16h05

Gràce à ce post, je suis arrivé au code suivant qui répond à mon problème excepté qu'il faut appuyer sur ENTRÉE pour connaître le texte qui a été sélectionné.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
 
    <script>
/* Sources :
    1) http://www.developpez.net/forums/d1199754/webmasters-developpement-web/javascript/bibliotheques-frameworks/jquery/recuperer-texte-selectionne-souris-lutilisateur/#post6575434
    2) http://www.developpez.net/forums/d1200420/webmasters-developpement-web/javascript/key-press-event/#post6576743
*/
function getSelected() {
    if(window.getSelection){
        return window.getSelection();
 
    } else if(document.getSelection){
        return document.getSelection();
 
    } else {
        var selection = document.selection && document.selection.createRange();
 
        if(selection.text) {
            return selection.text;
        }
        return false;
    }
 
    return false;
}
    </script>
  </head>
 
  <body>
 
Voilà un bout de texte <span style="color: red">pour tester</span>
<img src="http://www.developpez.net/template/images/logo.png">
ce qui est sélectionné.
 
  </body>
    <script>
document.onkeyup = function(event) {
  var keyCode = event.which || event.keyCode;
  if(keyCode == 13) {
      var test = getSelected();
 
      if(test != false){
          alert(">>>" + test + "<<<")
      }
  }
}
    </script>
</html>

Récupérer un texte sélectionné à la souris par l'utilisateur

jQuery

Discussions similaires

Partager

Partager