Wysiwyg : Rechercher un mot dans un SPAN ou un DIV ??? [Résolu]

Signaler
Messages postés
262
Date d'inscription
mardi 26 février 2002
Statut
Membre
Dernière intervention
27 février 2012
-
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
-
Bonjour,

Je cherche a créer une fonction qui permet de rechercher un mot uniquement dans un span spécifique (), et non dans toute la page !!!

D'avance merci.
Fabiano13

40 réponses

Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
texte texte texte
<script>

function ToutSelectionnerDiv(prm){

   if (document.selection){
   document.selection.empty();
   }else{
   if (window.getSelection){
   window.getSelection().removeAllRanges();
   }}
   if (document.selection){
      var sSelection = document.body.createTextRange();
      sSelection.moveToElementText(document.getElementById('foo2'));
      sSelection.select();
   }else{
   if (window.getSelection){
      var sSelection = document.createRange();
      sSelection.selectNode(document.getElementById('foo2'));
      window.getSelection().addRange(sSelection);
   }}
    var txt = document.getElementById("foo2").createTextRange();
    txt.findText(prm,0);
    txt.select();   
}

</script>

< textarea id ="foo2" name="ffo2" ContentEditable>
XXXX Texte texte texte Texte texte texte Texte texte texte Texte texte texte Texte texte texte...
</textarea>

    au plus simple, pour l'exemple, ne recherche que la 1ère occurence....
    ça baigne avec textarea, mais ni avec div, ni avec span....
    à mon avis, il va falloir faire ça "manuellement", indexof, expression régulière....
          mais avec les balises qui sont insérées en wysiwyg... bon amusement.

<hr />                Cordialement            Bul         [mon Site]     [M'écrire]
Messages postés
262
Date d'inscription
mardi 26 février 2002
Statut
Membre
Dernière intervention
27 février 2012

J'avance, j'avance à petit pas mais sûrement...

Le problème de ma petite fonction c'est qu'il prend à partir du div !
Donc il prendra le texte bleu ainsi que le vert. Comment faire pour qu'il prenne que le bleu, le div avec l'id foo2 ?


Merci de votre aide.
Fabiano13

<script>
function Rechercher(LeMot) {
    if (LeMot) {
        sSelection = document.body.createTextRange()
        sSelection.moveToElementText(document.getElementById('foo2'));
        while (sSelection.findText(LeMot,10000,0)) {
            sSelection.select()
            sSelection.scrollIntoView()
            if (confirm("Transférer dans l'autre liste ?")) {
                // Si on a trouvé le mot on le bascule dans l'autre liste
                break;
            }
            sSelection.collapse(false)       
        }   
    }
}
</script>


Texte texte texte Texte texte texte Texte texte texte Texte texte texte Texte texte texte

Texte texte texte Texte texte texte Texte texte texte Texte texte texte Texte texte texte

Texte texte texte Texte texte texte Texte texte texte Texte texte texte Texte texte texte

[# Rechercher le mot T E X T E]
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
Bonjour,
rapide sur le gaz...
une source qui
peut t'aider
 RECHERCHE ET COLORISATION, MISE EN SURBRILLANCE
ou encore
 RECHERCHE ET SURBRILLANCE
;O)
Messages postés
262
Date d'inscription
mardi 26 février 2002
Statut
Membre
Dernière intervention
27 février 2012

Ca modifie le code source, il reprend les className un à un !
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
Dans la source RECHERCHE ET
COLORISATION, MISE EN SURBRILLANCE, tu as une fonction qui remets en état

function Color_Undo(
where_)
c'est plutôt l'esprit qu'il faut regarder ou alors l'adapter
à ton réel besoin
;O)
Messages postés
262
Date d'inscription
mardi 26 février 2002
Statut
Membre
Dernière intervention
27 février 2012

Je ne cherche pas uniquement à mettre en surbrillance le mot recherché, mais dès qu'il tombe sur un des mots recherchés, lorsque je (!confirm) il me bascule le mot dans une autre liste.

Il faut trouver la faille dans mon code. Faites un copie/coller !!

<script>
function Rechercher(LeMot) {
    if (LeMot) {
        sSelection = document.body.createTextRange()
        sSelection.moveToElementText(document.getElementById('foo2'));
        while (sSelection.findText(LeMot,10000,0)) {
            sSelection.select()
            sSelection.scrollIntoView()
            if (confirm("Transférer dans l'autre liste ?")) {
                // Si on a trouvé le mot on le bascule dans l'autre liste
                break;
            }
            sSelection.collapse(false)       
        }   
    }
}
</script>


Texte texte texte Texte texte texte Texte texte texte Texte texte texte Texte texte texte

Texte texte texte Texte texte texte Texte texte texte Texte texte texte Texte texte texte

Texte texte texte Texte texte texte Texte texte texte Texte texte texte Texte texte texte

[# Rechercher le mot T E X T E]

D'avance merci.
Fabiano13
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
Ton problème est donc de récupérer la valeur
sélectionnée...semblerait-il
dans ce cas il te faut créer une fonction
d'ajout et y mettre le text de la sélection

exemple rapide :
<html>
<head>
<script type="text/javascript">

//------------------------------

function Add_Word( where_, txt_){
  var O_Dest =
document.getElementById( where_);
  O_Dest.innerHTML += txt_ +"
";

}
//-------------------------

function Rechercher(LeMot) {
  if (LeMot) {

    sSelection = document.body.createTextRange()

    sSelection.moveToElementText(document.getElementById('foo2'));

    while (sSelection.findText(LeMot,10000,0)) {

      sSelection.select()
      sSelection.scrollIntoView()
      if
(confirm("Transférer dans l'autre liste ?")) {
        // Si on a trouvé le mot on le bascule dans l'autre liste

        Add_Word( 'D_RESULT', sSelection.text);

        break;
      }
      sSelection.collapse(false)
    }

  }
}
</script>
</head>


Texte texte texte Texte texte texte Texte texte texte
Texte texte texte Texte texte texte



Texte texte
texte Texte texte texte Texte texte texte Texte texte texte Texte texte
texte


Texte texte texte Texte texte texte Texte texte texte Texte texte
texte Texte texte texte


[# Rechercher le mot T E X T
E]




</html>
Exclusif IE
;O)
Messages postés
262
Date d'inscription
mardi 26 février 2002
Statut
Membre
Dernière intervention
27 février 2012

Non, je veux uniquement faire une recherche dans le div qui a l'id=foo2

Avec ma fonction ça commence à partir du div (id=foo2) et prend aussi en compte le div suivant !

Merci pour ton aide.
Fabiano13
Messages postés
175
Date d'inscription
samedi 23 octobre 2004
Statut
Membre
Dernière intervention
8 mars 2015

Bonsoir

Peut être en cloisonnant avec un <form></forrm>

<html>
<head>
<script type="text/javascript">
//------------------------------
function Add_Word( where_, txt_){
  var O_Dest = document.getElementById( where_);
  O_Dest.innerHTML += txt_ +"
";
}
//-------------------------
function Rechercher(LeMot) {
  if (LeMot) {
    sSelection = document.body.createTextRange()




    sSelection.moveToElementText(form_A_Controler.document.getElementById('leSpan'));
    while (sSelection.findText(LeMot,10000,0)) {
      sSelection.select()
      sSelection.scrollIntoView()
      if (confirm("Transférer dans l'autre liste ?")) {
        // Si on a trouvé le mot on le bascule dans l'autre liste
        Add_Word( 'D_RESULT', sSelection.text);
        break;
      }
      sSelection.collapse(false)
    }
  }
}
</script>


</head>

<form name='form_A_Controler'>


Texte1 texte texte Texte texte texte Texte texte texte Texte texte texte Texte texte texte1


spanTexte1 texte texte Texte texte texte Texte2 texte texte Texte texte texte Texte texte


texte


 </form>




autreTexte1 texte texte Texte texte texte2 Texte texte texte Texte texte texte Texte texte texte


[# Rechercher le mot T E X T E]







</html>
Messages postés
262
Date d'inscription
mardi 26 février 2002
Statut
Membre
Dernière intervention
27 février 2012

Chez moi ça ne marche pas !

Est ce que c'est normal ?
Messages postés
262
Date d'inscription
mardi 26 février 2002
Statut
Membre
Dernière intervention
27 février 2012

Je m'y approche !!!

Le problème c'est qu'il me fait une dernière sélection ! Je ne comprends pas ! Faites un Copie/Coller, vous allez voir !

<script>


function Rechercher(LeMot) {
    if (LeMot) {
       
        sSelection = document.body.createTextRange()
        sSelection.moveToElementText(document.getElementById('foo2'));
       
        while (sSelection.findText(LeMot)) {


        sSelection.select()


if (foo2.document.selection.createRange().parentElement().parentNode.id == "foo2"){
 if (confirm("Transférer dans l'autre liste ?")) {
                // Si on a trouvé le mot on le bascule dans l'autre liste
  break;
 
 }
}


  sSelection.collapse(false); 
    }   
  }
}
</script>


Textea texte texte Texte texte texte Texte texte texte Texte texte texte Texte texte texte


Texte texte texte Texte texte texte Texte texte texte Texte texte texte Texte texte texte


Texte texte texte Texte texte texte Texte texte texte Texte texte texte Texte texte texte

[# Rechercher le mot T E X T E]
Messages postés
262
Date d'inscription
mardi 26 février 2002
Statut
Membre
Dernière intervention
27 février 2012

Je relance la question... Ca fait déjà 2 jours que je bloc !! Pouvez-vous m'aider ?

D'avance merci.
Fabiano13
Messages postés
3472
Date d'inscription
lundi 16 juillet 2007
Statut
Membre
Dernière intervention
28 février 2014
35
moi, perso je suis hors jeu, HS, lol

Désolé !

Si t'a besoin d'aide, MP !!!
Messages postés
262
Date d'inscription
mardi 26 février 2002
Statut
Membre
Dernière intervention
27 février 2012

Et les autres ? Je ne trouve pas la solution pour sortir de cette boucle !!
Messages postés
262
Date d'inscription
mardi 26 février 2002
Statut
Membre
Dernière intervention
27 février 2012

Enfin j'ai changé de méthode !


Voici le résultat concluant :


Encore mercis à DB77, jparia, nicomilville, bultez et à PetoleTeam pour leur aide.


<script type="text/JavaScript">
function Rechercher(LeMot) {
    var sSelectBlock1, sSelectBlock2, cont;
    sBlockSpan = document.getElementById("foo2");    sSelectBlock1 sSelectBlock2 document.body.createTextRange();
    sSelectBlock1.moveToElementText(sBlockSpan);
   
    while (sSelectBlock1.findText(LeMot)) {
        if (sSelectBlock1.offsetTop>sBlockSpan.offsetTop+sBlockSpan.offsetHeight){break;}
        sSelectBlock1.select();
  sSelectBlock1.scrollIntoView();
if (confirm("Est-ce bon ?")) {
alert('On transfère "' + LeMot + '" dans la liste !!')
return false;
}
        sSelectBlock1.collapse(false);
        sSelectBlock2 = sSelectBlock1.duplicate();
        sSelectBlock1.moveToElementText(sBlockSpan);
        sSelectBlock1.setEndPoint("StartToEnd", sSelectBlock2);
    }
}
</script>
</head>


Rechercher (Et)

Maître Corbeau, sur un arbre perché,
           Tenait en son bec un fromage.
       Maître Renard, par l'odeur alléché,
           Lui tint à peu près ce langage :
       Et bonjour, Monsieur du Corbeau,
    Que vous êtes joli ! que vous me semblez beau !
           Sans mentir, si votre ramage
           Se rapporte à votre plumage,
     Vous êtes le Phénix des hôtes de ces bois.
À ces mots le Corbeau ne se sent pas de joie,
           Et pour montrer sa belle voix,
   Il ouvre un large bec, laisse tomber sa proie.
   Le Renard s'en saisit, et dit : Mon bon Monsieur,
              Apprenez que tout flatteur
     Vit aux dépens de celui qui l'écoute.
   Cette leçon vaut bien un fromage sans doute.
           Le Corbeau honteux et confus
   Jura, mais un peu tard, qu'on ne l'y prendrait plus


 

    Maître Corbeau, sur un arbre perché,
           Tenait en son bec un fromage.
       Maître Renard, par l'odeur alléché,
           Lui tint à peu près ce langage :
       Et bonjour, Monsieur du Corbeau,
    Que vous êtes joli ! que vous me semblez beau !
           Sans mentir, si votre ramage
           Se rapporte à votre plumage,
     Vous êtes le Phénix des hôtes de ces bois.
À ces mots le Corbeau ne se sent pas de joie,
           Et pour montrer sa belle voix,
   Il ouvre un large bec, laisse tomber sa proie.
   Le Renard s'en saisit, et dit : Mon bon Monsieur,
              Apprenez que tout flatteur
     Vit aux dépens de celui qui l'écoute.
   Cette leçon vaut bien un fromage sans doute.
           Le Corbeau honteux et confus
   Jura, mais un peu tard, qu'on ne l'y prendrait plus

Maître Corbeau, sur un arbre perché,
           Tenait en son bec un fromage.
       Maître Renard, par l'odeur alléché,
           Lui tint à peu près ce langage :
       Et bonjour, Monsieur du Corbeau,
    Que vous êtes joli ! que vous me semblez beau !
           Sans mentir, si votre ramage
           Se rapporte à votre plumage,
     Vous êtes le Phénix des hôtes de ces bois.
À ces mots le Corbeau ne se sent pas de joie,
           Et pour montrer sa belle voix,
   Il ouvre un large bec, laisse tomber sa proie.
   Le Renard s'en saisit, et dit : Mon bon Monsieur,
              Apprenez que tout flatteur
     Vit aux dépens de celui qui l'écoute.
   Cette leçon vaut bien un fromage sans doute.
           Le Corbeau honteux et confus
   Jura, mais un peu tard, qu'on ne l'y prendrait plus
.


 
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
nickel fabiano.
    et pour la solution ( exclusive IE hélas, il reste à adapter pour d'autres navigateurs )
    et pour l'avoir donnée ici.
merci donc.
<hr />                Cordialement            Bul         [mon Site]     [M'écrire]
Messages postés
3472
Date d'inscription
lundi 16 juillet 2007
Statut
Membre
Dernière intervention
28 février 2014
35
ok, je suis content que tu es trouvé ta solution, met la en réponse accèpté !

a++

Si t'a besoin d'aide, MP !!!
Un forum...
Messages postés
262
Date d'inscription
mardi 26 février 2002
Statut
Membre
Dernière intervention
27 février 2012

Attends un peu, je cherche à omettre les accents ! Si quelqu'un à une idée ?
Messages postés
3472
Date d'inscription
lundi 16 juillet 2007
Statut
Membre
Dernière intervention
28 février 2014
35
je connais des fonctions en php mais en js franchement je n'en connais aucune maintenant je laisse la parole a bultez !

a++

Si t'a besoin d'aide, MP !!!
Un forum...
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
un ch'tiot replane... si c'est ce qui convient....

//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function chgt(avant,apres,zone)  //~~ remplacer caractères génants ~~
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
{  var reg= new RegExp(avant,"g");
    return zone.replace(reg,apres); 
}

    var pos=chgt("[àäâ]","a", le_texte_initial_avec_des_accents );
    pos =chgt("[éèêë]","e",pos);
    pos=chgt("[ïî]","i",pos);
    pos=chgt("[ôö]","o",pos);
    pos=chgt("[ùûü]","u",pos);

    mais bon... on doit pouvoir mieux faier...

<hr />                Cordialement            Bul         [mon Site]     [M'écrire]