[HTML] Balise image - Texte alternatif

Version imprimable

05/05/2006, 12h13
jak0

[HTML] Balise image - Texte alternatif

Bonjour à tous,

Je voulais vous poser un petit problème. Sur une page HTML, j'affiche une simple image du style :

Code:

<img src="test.gif" />

Je voudrais faire en sorte que quand l'utilisateur copie le texte entourant l'image et qu'il colle ce texte dans un editeur simple tel notepad. Cette image soit remplacé par un texte.

Avec Firefox, le code suivant fonctionne à merveille :

Code:

<img src="test.gif" alt="test-image" />

Mais avec IE, j'ai beau chercher, rien ne marche

Code:

<img src="test.gif" alt="test-image-alt" name="test-image-name" title="test-image-title" />

Ca met toujours un espace à la place de l'image, mais jamais le texte.

Je cherche dans tous les sens, mais c'est difficle de trouver des infos la dessus. Si quelqu'un peu m'aider, ca serait bien cool.

A++ et merci d'avance
05/05/2006, 12h16
franculo_caoulene

Salut,

Peut-être que ce n'est tout simplement pas pris en compte par IE.
05/05/2006, 13h35
jak0

Oui peut-être bien (meme si ca me parait bizarre), mais au pire en Javascript, yaurai pas une astuce ???
05/05/2006, 13h52
franculo_caoulene

Ca demanderait beaucoup d'effort mais ça peut être possible je pense (simple avis personnel). Mais il faut vraiment que cette fonction te soit nécessaire.
05/05/2006, 14h16
jak0

C'est bien ca le probleme, c'est que c'est indispensable. Je fait ça pour mon taff, et je suis obligé d'utiliser IE.
Je suis entrain de chercher du coté de

Code:

document.selection.createRange().text

Le problème c'est que ça non plus ne récupère pas l'image.

Il faudrait que je puisse récupérer le code source de la sélection en fait. Un peu comme on peu faire sous Firefox.
05/05/2006, 14h28
denisC

Citation:

Envoyé par jak0

Il faudrait que je puisse récupérer le code source de la sélection en fait. Un peu comme on peu faire sous Firefox.

A mon avis, c'est pas gagné du tout. C'est vraiment indispensable?????
05/05/2006, 14h44
jak0
Oui !!!

Je suis sur une autre piste :
Avec document.images je peut récupérer la liste des images de la page HTML. Peut-etre que en parcourant la selection et en détectant l'endroit où normalement ya une image, je pourrai éventuellement récupérer la valeur de sa propriété alt, et la rajouter dans la sélection :
Code:

1 2 Image1 <img src=image1.gif alt=image1 id="Image1" /><br /> Image2 <img src=image2.gif alt=image2 id="Image2" />
J'essaye alors a chaque debut de ligne de récupérer une image dont l'identifiant est les 6 premiers caractères de la ligne...

En effet, ma page sera toujours formatté de la meme facon.

Qu'est ce que vous en pensez ?

Bon pour ce qui est de la détection de l'image et du remplacement c'est bon.

Code:

1
2
3
4
5
6
7
8
9
10
 
    txt = document.selection.createRange().text;
    tab = txt.split("\n");
    for (i=0;i<tab.length;i++) {
      ligne = tab[i];
      if (document.getElementById(ligne.substr(0, 6)) != null) {
        ligne += document.getElementById(ligne.substr(0, 6)).alt;
      }
      alert(ligne);
    }

Il reste plus qua remettre le resultat dans le presse papier sans modifier la page

05/05/2006, 15h02
denisC

Citation:

Envoyé par jak0

Il reste plus qua remettre le resultat dans le presse papier sans modifier la page

:faq:
http://javascript.developpez.com/faq...g#pressePapier

Merci bien, ca marche nickel

Code:

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
58
59
60
61
62
<html>
 
<head>
<script>
function copy() {
  if (document.selection) {
    selection = document.selection.createRange().text;
    if (selection.length > 0) {
      clipboard = ""+window.clipboardData.getData("Text");
      selection = selection.replace (/ /g, "");
      clipboard = clipboard.replace (/ /g, "");
      selection = selection.replace (/\r/g, "");
      clipboard = clipboard.replace (/\r/g, "");
      selection = selection.replace (/\n/g, "");
      clipboard = clipboard.replace (/\n/g, "");
      clipboard = clipboard.replace (/"DateEtat"/g, "Date Etat");
      if (clipboard == selection) {
        data = window.clipboardData.getData("Text");
        data = data.replace (/\n/g, "\r\n");
        data = data.replace (/\r\r/g, "\r");
        tab = data.split("\n");
        texte = "";
        for (i=0;i<tab.length;i++) {
          ligne = tab[i];
          //alert("_"+ligne+"_");
          if (document.getElementById(ligne.substr(0, 19)) != null) {
 
            ligne = ligne.substr(0, 19) + " " + document.getElementById(ligne.substr(0, 19)).alt;
          }
          texte = texte + ligne + "\r\n";
        }
        window.clipboardData.setData("Text", texte);
      }
    }
  }
  return (false);
}
</script>
</head>
 
<body onmouseout="copy();">
Texte précédent<br />
  <table border="1" align="center" valign="center">
    <tr>
     <td align="center"><b>Date</b></td>
     <td align="center"><b>Etat</b></td>
    </tr>
    <tr class='liste-impaire'>
      <td align="center">02/05/2006&nbsp;21:58:34</td>
      <td align="center">
        <img id="02/05/2006 21:58:34" src='imgOk.gif' width='16' height='16' alt='OK' title='OK' />
      </td>
    </tr>
    <tr class='liste-paire'>
      <td align="center">02/05/2006&nbsp;16:30:36</td>
      <td align="center">
        <img id="02/05/2006 16:30:36" src='imgNok.gif' width='16' height='16' alt='HS' title='HS' />
      </td>
    </tr>
  </table>
</body>
</html>

Pour ceux qui veulent...

Merci encore