Rechercher-remplacer en Javascript

**olivierSG** · 27/08/2010, 12h31

Bonjour,

Totalement néophyte en Javascript, j'ai besoin de réaliser un petit utilitaire de conversion très simple :
à partir du texte récupéré d'un champ de texte, il doit effectuer un nombre relativement important de rechercher-remplacer (prédéterminés) très simples et restituer le résultat dans le champ de départ (ou un autre).
Comme ça doit fonctionner sur n'importe quelle plateforme, la réponse la plus pertinente me semblait être une page html avec un peu de Javascript.
J'ai donc farfouillé un peu sur Internet et j'ai écrit ceci :

Code :

Code html :

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Convertisseur SGEcole</title>
</head>
 
<body>
<script type="text/javascript">
// string_replace.jsl
public class Program
{
    public static void main(String[] args)
    {
        String str = "The quick brown fox jumps over the lazy dog.";
 
        // Ajouter l'accroche au T.
        String newStr = str.replace('T', 'T*');
 
        // Display the strings for comparison.
        document.write("old = " + str);
        document.write("new = " + newStr);
    }
}
/*
Output:
old = The quick brown fox jumps over the lazy dog.
new = T*he quick brown fox jumps over the lazy dog.
*/
</script> 
</body>
</html>

Le problème, c'est que ça ne m'affiche rien : où est le bug ?
Question subsidiaire : comment extraire le contenu d'un champ créé en HTML pour l'utiliser dans le traitement ? et comment le remettre dedans, après ?

En partant de quelque chose comme ça :

Code html :

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

1
2
3
4
5
<body>
<form>
<textarea name="aireDeTexte" cols="400" rows="40">Saisissez ou collez ici votre texte</textarea>
<input type="button" value="Rechercher / Remplacer" onClick="chercheRemplace( this.form.aireDeTexte.value, this.form.aireDeTexte )">
</form>

Merci pour votre aide.

**SpaceFrog** · 27/08/2010, 12h37

tu ne serais pas en train de confondre java et javascript ?

**olivierSG** · 27/08/2010, 12h49

Envoyé par SpaceFrog

tu ne serais pas en train de confondre java et javascript ?

Ben, on m'a dit exactement la même chose sur le forum Java ! Et apparemment, ils pensent que Javascript est plus adapté pour mon besoin.

C'est très possible en effet que je me sois mélangé les pinceaux. Ce que j'ai écrit dans mon <script type="text/javascript">, c'est du Java, pas du Javascript, c'est ça ?

Est-ce que ceci fonctionnerait mieux ?

Code :

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

1
2
3
4
var aRemplacer = /\+/g;
var machaine = "le+petit+chat+noir+est+malade"
machaine = machaine.replace(aRemplacer, " ")
alert (machaine);

Et comment le modifier, sachant que je voudrais extraire machaine d'un champ accessible à l'utilisateur et renvoyer le contenu dans un champ (éventuellement le même) où l'utilisateur pourra le recopier, et non dans un message d'alerte ?

Merci pour vos réponses.

**SpaceFrog** · 27/08/2010, 15h03

Oui ton code entre balises était du java.
Oui le nouveau code est du javascript .

tu veux que l'utilisateur entre un texte, tu le moulines et tu le resitutes ?

un input type text ou un textarea et un input type button suffiront

Code :

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

1
2
3
4
5
6
7
8
9
<script type='text/javascript'>
function foo(obj){
bar=document.getElementById(obj)
bar.value=bar.value.replace(/\+/g+,' ')
}
</script>
 
<input type='text' id='motxt' value='' />
<input type='button'  value='go' onclick="foo('montxt')" />

**olivierSG** · 27/08/2010, 16h07

Envoyé par SpaceFrog

Oui ton code entre balises était du java.
Oui le nouveau code est du javascript .

tu veux que l'utilisateur entre un texte, tu le moulines et tu le restitues ?

'zactement.

Envoyé par SpaceFrog

un input type text ou un textarea et un input type button suffiront

Je préfère un textarea.

Envoyé par SpaceFrog

Code :

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

1
2
3
4
5
6
7
8
9
<script type='text/javascript'>
function foo(obj){
bar=document.getElementById(obj)
bar.value=bar.value.replace(/\+/g+,' ')
}
</script>
 
<input type='text' id='motxt' value='' />
<input type='button'  value='go' onclick="foo('montxt')" />

Ça a l'air de marcher. J'approfondis et je vous tiens au courant.

Merci beaucoup.

**olivierSG** · 01/09/2010, 14h48

Envoyé par SpaceFrog

Oui ton code entre balises était du java.
Oui le nouveau code est du javascript.

tu veux que l'utilisateur entre un texte, tu le moulines et tu le restitues ?

un input type text ou un textarea et un input type button suffiront

Code :

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

1
2
3
4
5
6
7
8
9
<script type='text/javascript'>
function foo(obj){
bar=document.getElementById(obj)
bar.value=bar.value.replace(/\+/g+,' ')
}
</script>
 
<input type='text' id='motxt' value='' />
<input type='button'  value='go' onclick="foo('montxt')" />

OK. Donc j'ai écris ceci, qui fonctionne :

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
 
<body>
<script type='text/javascript'>
function foo(obj){
bar=document.getElementById(obj)
bar.value=bar.value.replace(/TexteARemplacer1/g,'TexteDeRemplacement1')
bar.value=bar.value.replace(/TexteARemplacer2/g,'TexteDeRemplacement2')
[...]
bar.value=bar.value.replace(/TexteARemplacerX/g,'TexteDeRemplacementX')
}
</script>
 
<input type='text' id='motxt' value='' />
<input type='button'  value='go' onclick="foo('motxt')" />
</body>
</html>

Maintenant, ce que je voudrais, c'est effectuer les mêmes traitements, mais à partir de et vers un textarea aimablement fourni par un collègue, et défini sur Dreamweaver comme ceci :

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
 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Convertisseur</title>
<style type="text/css">
#apDiv1 {
	position:absolute;
	left:47px;
	top:72px;
	width:581px;
	height:120px;
	z-index:1;
	background-color: #FFFFFF;
	font-size: 36px;
	font-family: "MaFonte";
}
body {
	background-color: #FFFFFF;
}
</style>
</head>
 
<body>
<div id="apDiv1">
  <form id="form1" name="form1" method="post" action="font-family:Caflisch Script, Adobe Poetica, Sanvito, cursive;}">
    <pre><label for="MaFonte"></label><textarea name="MaFonte" id="MaFonte" cols="45" rows="5"></textarea>  </pre>
  </form>
</div>
</body>
</html>

Comment puis-je faire ? J'ai besoin d'un textarea pour pouvoir tenir compte, notamment d'éléments comme des retours chariots, des tabulations, dans mon traitement.

Question pour aller plus loin :
Idéalement, je voudrais pouvoir réduire mon interface à un bouton, les traitements s'effectuant depuis et vers le presse-papier, pour que ce soit le plus transparent possible pour l'utilisateur. Est-ce possible ? Est-ce conseillé ?
Comment faire ?

Merci en tout cas, pour l'aide précieuse déjà fournie.

**SpaceFrog** · 01/09/2010, 15h08

tu as une fonction, à la quelle tu passes un id ...

ton textarea a un id ...

Rechercher-remplacer en Javascript

JavaScript

Vue hybride

Discussions similaires

Partager

Partager