texarea - Selection, emplacement

**djibril** · 22/10/2008, 17h26

Bonjour,

J'ai un texarea dans une page et je souhaiterais faire le même principe que sur ce forum par exemple.
Comment récupérer le texte sélectionné par l'utilisateur dans un textarea et par la suite le remplacer.
Ex : lien italique. Je sélectionne le texte toto et clique sur le lien => toto remplacé par toto.

Je fouille sur google mais ne trouve rien

Merci

**bigboomshakala** · 23/10/2008, 00h21

**djibril** · 23/10/2008, 10h16

Personne n'a de solution?

**bigboomshakala** · 23/10/2008, 10h21

Envoyé par djibril

Personne n'a de solution?

mon smiley est cliquable (j'étais d'humeur taquine hier soir).
regarde getSelectionStart et getSelectionEnd

**djibril** · 23/10/2008, 11h22

Ok merci, j'ai pas fait gaffe, je regarde ça

**djibril** · 31/10/2008, 10h06

Bon je comprends rien, quelqu'un aurait il un exemple basique.

Merci

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
52
53
54
55
56
 
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  <title>test</title>
  <!--
<script language="JavaScript">
 
 
/******************************************************************/
//	getSelectionStart
//  renvoie la position de début de la sélection dans une zone
//  de texte (input, textarea)
/******************************************************************/
function getSelectionStart(o)
{
	if ( typeof o.selectionStart != 'undefined' )
		return o.selectionStart;
 
	// IE Support
	o.focus();
	var range = o.createTextRange();
	range.moveToBookmark(document.selection.createRange().getBookmark());
	range.moveEnd('character', o.value.length);
	return o.value.length - range.text.length;
}
/******************************************************************/
//	getSelectionEnd
//  renvoie la position de fin de la sélection dans une zone
//  de texte (input, textarea)
/******************************************************************/
function getSelectionEnd(o)
{
	if ( typeof o.selectionEnd != 'undefined' )
		return o.selectionEnd;
 
	// IE Support
	o.focus();
	var range = o.createTextRange();
	range.moveToBookmark(document.selection.createRange().getBookmark());
	range.moveStart('character', - o.value.length);
	return range.text.length;
}
</script>
-->
  </head>
  <body>
  <form name="formulaire">
<textarea name="test" rows="12" cols="20"> dfhgjdfh   dkfg 
kdgh m 
d d</textarea>
<input type="submit" name="input" onclik="javascript:???">
 
</form>
  </body>
</html>

**SpaceFrog** · 31/10/2008, 10h17

voici la partie insertion des balises

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
52
53
54
55
56
57
<html>
<head>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">

<title>Nouvelle page 1</title>
<style type='text/css'>
.strong {font-weight:bold;}
.red {color:red;}

</style>


<script type="text/javascript">
function swapBalise(balise,classe,texte){

var Reg=(document.all)?new RegExp("[\[]b[\]](.+)[\[]\/b[\]]","gi"):/\[b\](.+)(\[\/b\])/gi;

//varReg1=new RegExp('<span class="strong">'+/$1/+'</span>')

//var Reptexte=texte.replace( Reg,'<span class="'+classe+'">$1</span>')
var Reptexte=texte.replace( Reg,'<span class="'+classe+'">$1</span>')

alert(Reptexte)
return Reptexte;
}

function check(val){
var reg=(document.all)? new RegExp("[\[]{1}url=((.)*?(\s?))[\]]","gi"):/\[url=([\s\S]*(\s?))\]/gi;
var Reptexte=val.replace( reg,'<a href="$1">$1</a>')

alert(Reptexte)
}

function surbrillance(ou,quoi){
var StrReg='('+quoi+')(?=.<)'
var Reg=new RegExp(StrReg,"gi")
ou.innerHTML= ou.innerHTML.replace(Reg,'<span style="background-color:yellow;">$1</span>')
}



</script>


</head>

<body>
<div onclick="this.innerHTML=swapBalise('b','strong',this.innerHTML)" > bonjour jean  </div>
<div onclick="this.innerHTML=swapBalise('r','red',this.innerHTML)" > bonjour [r]jean[/r]  </div>
<div onclick="this.innerHTML=surbrillance(this,'red')" > red bonjour red rediriger quoi  </div>
<div id="zone">bonjour tout <span class="tout">le monde</span></div>  
<input type='button' value="go" onclick="surbrillance(document.getElementById('zone'), 'tout')" style="width:300px">
</body>

</html>

reste à y adjoindre la partie selection fais une recherche avec createRange et selectionStart

**djibril** · 04/11/2008, 17h57

Bon J'ai trouvé une solution toute faite que j'ai adapté à mes besoins.

Merci

texarea - Selection, emplacement

JavaScript

Discussions similaires

Partager

Partager