Surbrillance d'une partie d'une zone text

**acheda** · 12/01/2007, 16h27

Bonjour,

Après quelques recherches infructueuses, je m'adresse à vous pour mon problème.

J'ai ceci dans une de mes pages :

Code :

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

<input type="text" id="findAdvanced" name="find" size = 55/>

A partir d'un javascript externe, je souhaite mettre en surbrillance (pré-sélectionner) une partie du texte contenu dans cette zone, de manière à ce qu'un utilisateur n'ai plus qu'à remplacer cette partie (et uniquement cette partie) de texte par une autre qu'il tapera au clavier.
Ca lui évite d'avoir à faire la sélection lui-même.

Et... Ben je ne sais pas faire...

En tous cas, bon week-end

**ryan** · 12/01/2007, 20h46

Yop!

J'ai pas beaucoup de temps pour approfondir le sujet là maintenant, mais je serais toi, j'irais voir du côté de createTextRange.

**ryan** · 13/01/2007, 11h29

Yop!

Comme j'avais un peu plus de temps aujourd'hui, voici un exemple d'utilisation de createTextRange:

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
 
<html>
<head>
<script language="javascript">
function SelectText() 
{
	var thetext = document.forms.maform.moninput.createTextRange();
	thetext.findText("un petit peu de texte");
	thetext.select();
}
</script>
</head>
<body onLoad="SelectText()">
<form name="maform" method=post>
<input type=text name="moninput" size=50 value="ceci est un petit peu de texte">
</form>
</body>
</html>

**acheda** · 15/01/2007, 08h58

Ma foi, je m'en vais essayer ça de retour de week-end :-)
Merci beaucoup, je te tiens au courant.

**acheda** · 15/01/2007, 11h36

Merci Ryan pour ta piste : cela m'a bien aidée :-)

J'ai "trifouillé" un peu sur les sujets de forums et sur le net à partir de ce que tu m'as indiqué.

Voici le code de ma méthode, qui fonctionne pour IE et Firefox.

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
 
function SelectText(posDebutMot, longueurMot, decFin) 
    // posDebutMot : sert dans le cas d'IE position du premier caractère du mot ou de l'expression ajoutée
    // longueurMot : longueur du mot ou de l'expression qu'on rajoute au champ
    // decFin : décalage à effectuer sur la fin en fonction du caractère qui termine le mot ou l'expression ajoutée. 
{
    var input = document.getElementById("findAdvanced");
 
/* Internet Explorer */
  if(typeof document.selection != 'undefined') {
    var thetext = document.getElementById("findAdvanced").createTextRange();
    thetext.moveStart("character", posDebutMot);
    thetext.moveEnd("character", -decFin);
    thetext.select();
  }
 
/* Mozilla / firefox / opera / netscape*/
  else if(typeof input.selectionStart != 'undefined'){
    input.focus();
    var posDebut = input.selectionStart - longueurMot - decFin;
    var posFin = input.selectionEnd - decFin;
    input.selectionStart = posDebut;
    input.selectionEnd = posFin;  
  }
}

Par exemple : lorsque j'ajoute "mot" à mon expression (avec les guillemets), il me sélectionne mot (sans les guillemets). Si j'ajoute -mot (avec le '-') il me sélectionne mot.

Bon, je suis plutôt à classer dans les débutants en javascript alors s'il y a des améliorations possibles : je suis preneuse!

Surbrillance d'une partie d'une zone text

JavaScript

Vue hybride

Discussions similaires

Partager

Partager