Trouver la position d'une image avec getElementsByTagName

**PrinceMaster77** · 26/06/2006, 09h22

je voudrais connaitre la page qui sera afficher dans chaque div dans l'ordre c'est à dire que je voudrais
connaitre dans une fonction Javascript le nom de mes premieres images c'est à dire le nom de la prmiere image de chaque div
en allant de gauche à droite puis passer à la seconde ligne.

Voici mon code :

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
 
  <fieldset id=Demo4>
   <legend>Composition du document <% = NomDoc %></legend>
   <div id='contenant'>
    <div class=DragContainer id='DragContainer1' overClass="OverDragContainer">
     <div class=DragBox id="Page<% = i %>" name="Page<% = i %>" overClass="OverDragBox" dragClass="DragDragBox" align="center">
      <img name="<% = i %>" src="Img/Ass/<% = NomDoc %>-<% = NumImg %>.jpg" height="150px" width="128px"><br>
      <b name="<% = i %>">Page <% = i %></b>
      <input OnClick="SuppJpg('<% = NumImg %>');" type="image" src="Img/PetitDelete.gif"> 
     </div>
    </div>
 
    <div class=DragContainer id='DragContainer1' overClass="OverDragContainer">
     <div class=DragBox id="Page<% = i %>" name="Page<% = i %>" overClass="OverDragBox" dragClass="DragDragBox" align="center">
      <img name="<% = i %>" src="Img/Ass/<% = NomDoc %>-<% = NumImg %>.jpg" height="150px" width="128px"><br>
      <b name="<% = i %>">Page <% = i %></b>
      <input OnClick="SuppJpg('<% = NumImg %>');" type="image" src="Img/PetitDelete.gif"> 
     </div>
    </div>
 
    <div class=DragContainer id='DragContainer1' overClass="OverDragContainer">
     <div class=DragBox id="Page<% = i %>" name="Page<% = i %>" overClass="OverDragBox" dragClass="DragDragBox" align="center">
      <img name="<% = i %>" src="Img/Ass/<% = NomDoc %>-<% = NumImg %>.jpg" height="150px" width="128px"><br>
      <b name="<% = i %>">Page <% = i %></b>
      <input OnClick="SuppJpg('<% = NumImg %>');" type="image" src="Img/PetitDelete.gif"> 
     </div>
    </div>
 
    <div class=DragContainer id='DragContainer1' overClass="OverDragContainer">
     <div class=DragBox id="Page<% = i %>" name="Page<% = i %>" overClass="OverDragBox" dragClass="DragDragBox" align="center">
      <img name="<% = i %>" src="Img/Ass/<% = NomDoc %>-<% = NumImg %>.jpg" height="150px" width="128px"><br>
      <b name="<% = i %>">Page <% = i %></b>
      <input OnClick="SuppJpg('<% = NumImg %>');" type="image" src="Img/PetitDelete.gif"> 
     </div>
    </div>
 
    <div class=DragContainer id='DragContainer1' overClass="OverDragContainer">
     <div class=DragBox id="Page<% = i %>" name="Page<% = i %>" overClass="OverDragBox" dragClass="DragDragBox" align="center">
      <img name="<% = i %>" src="Img/Ass/<% = NomDoc %>-<% = NumImg %>.jpg" height="150px" width="128px"><br>
      <b name="<% = i %>">Page <% = i %></b>
      <input OnClick="SuppJpg('<% = NumImg %>');" type="image" src="Img/PetitDelete.gif"> 
     </div>
    </div>
   </div>
  </fieldset>

et voici mon code Javascript :

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
 
    function OrdrePage(NbFile){
     var Image = document.getElementsByTagName('IMG');
     var array = new Array();
     var array2 = new Array();
 
     for(var i=0; i<=NbFile;i++){
      if(i == 0){
       var targObj = document.getElementById('Page1');
      }else if(i == 1){
       var targObj = document.getElementById('Page2');
      }else if(i == 2){
       var targObj = document.getElementById('Page3');
      }else if(i == 3){
       var targObj = document.getElementById('Page4');
      }else if(i == 4){
       var targObj = document.getElementById('Page5');
      }else if(i == 5){
       var targObj = document.getElementById('Page6');
      }else if(i == 6){
       var targObj = document.getElementById('Page7');
      }else if(i == 7){
       var targObj = document.getElementById('Page8');
      }
     }
 
     // Je coince ici pour récupérer le nom de mon div "Page1" par exemple
 
     document.DragAndDrop.OrdrePage.value = array;
     document.DragAndDrop.OrdrePage2.value = array2;
 
//     document.DragAndDrop.action='JpgToPdf.asp'
//     document.DragAndDrop.target = "_top";
//     document.DragAndDrop.method = "post";
//     document.DragAndDrop.submit();	
//     return true;
    }

**SpaceFrog** · 26/06/2006, 10h37

un id doit être unique sur une page

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
<script type='text.javascript'>
function getFirstImages(){
var TabFirstImg=new Array();
var TabDivs=document.getElementsByTagName('div');
for (i=0;i<TabDivs.length;i++){
							if(TabDivs[i].getElementsByTagName('img')){
							                              TabFirstImg.push(TabDivs[i].getElementsByTagName('img')[0])
         }
         }
 
for (i=0;i<TabFirstImg.length;i++){document.write(TabFirstImg[i].id+ "<br/>")}         
        }
 
</script>    
 
 
</head>
 
<body onload="getFirstImages()">
 
 
<div>
<img id='firstimageone' />
<img id='secondimageone' />
</div>
<div>
<img id='firstimagetwo' />
<img id='secondimagetwo' />
</div>
 
<div>
<img id='firstimagethree' />
<img id='secondimagethree' />
</div>
 
 
</body>
</html>

**PrinceMaster77** · 26/06/2006, 11h59

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
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
 
  <fieldset id=Demo4>
   <legend>Composition du document DANK@REPRO NEW</legend>
   <div id='contenant'>
    <div class=DragContainer id='DragContainer1' overClass="OverDragContainer">
 
          <div class=DragBox id="Page1" name="Page1" overClass="OverDragBox" dragClass="DragDragBox" align="center">
           <img id="1" name="1" src="Img/Ass/DANK@REPRO NEW-001.jpg" height="150px" width="128px"><br>
           <b name="1">Page 1</b>
           <input OnClick="SuppJpg('001');" type="image" src="Img/PetitDelete.gif"> 
          </div>
 
          <div class=DragBox id="Page7" name="Page7" overClass="OverDragBox" dragClass="DragDragBox" align="center">
           <img id="7" name="7" src="Img/Ass/DANK@REPRO NEW-007.jpg" height="150px" width="128px"><br>
           <b name="7">Page 7</b>
           <input OnClick="SuppJpg('007');" type="image" src="Img/PetitDelete.gif"> 
          </div>
 
    </div>
 
    <div class=DragContainer id='DragContainer2' overClass="OverDragContainer">
 
          <div class=DragBox id="Page2" name="Page2" overClass="OverDragBox" dragClass="DragDragBox" align="center">
           <img id="2" name="2" src="Img/Ass/DANK@REPRO NEW-002.jpg" height="150px" width="128px"><br>
           <b>Page 2</b>
           <input OnClick="SuppJpg('002');" type="image" src="Img/PetitDelete.gif"> 
          </div>         
 
          <div class=DragBox id="Page8" name="Page8" overClass="OverDragBox" dragClass="DragDragBox" align="center">
           <img id="8" name="8" src="Img/Ass/DANK@REPRO NEW-008.jpg" height="150px" width="128px"><br>
           <b>Page 8</b>
           <input OnClick="SuppJpg('008');" type="image" src="Img/PetitDelete.gif"> 
          </div>         
 
    </div>
 
    <div class=DragContainer id='DragContainer3' overClass="OverDragContainer">
 
          <div class=DragBox id="Page3" name="Page3" overClass="OverDragBox" dragClass="DragDragBox" align="center">
           <img id="3" name="3" src="Img/Ass/DANK@REPRO NEW-003.jpg" height="150px" width="128px"><br>
           <b>Page 3</b>
           <input OnClick="SuppJpg('003');" type="image" src="Img/PetitDelete.gif"> 
          </div>         
 
    </div>
 
    <div class=DragContainer id='DragContainer4' overClass="OverDragContainer">
 
          <div class=DragBox id="Page4" name="Page4" overClass="OverDragBox" dragClass="DragDragBox" align="center">
           <img id="4" name="4" src="Img/Ass/DANK@REPRO NEW-004.jpg" height="150px" width="128px"><br>
           <b>Page 4</b>
           <input OnClick="SuppJpg('004');" type="image" src="Img/PetitDelete.gif"> 
          </div>         
 
    </div>
 
    <div class=DragContainer id='DragContainer5' overClass="OverDragContainer">
 
          <div class=DragBox id="Page5" name="Page5" overClass="OverDragBox" dragClass="DragDragBox" align="center">
           <img id="5" name="5" src="Img/Ass/DANK@REPRO NEW-005.jpg" height="150px" width="128px"><br>
           <b>Page 5</b>
           <input OnClick="SuppJpg('005');" type="image" src="Img/PetitDelete.gif"> 
          </div>         
 
    </div>
 
    <div class=DragContainer id='DragContainer6' overClass="OverDragContainer">
 
          <div class=DragBox id="Page6" name="Page6" overClass="OverDragBox" dragClass="DragDragBox" align="center">
           <img id="6" name="6" src="Img/Ass/DANK@REPRO NEW-006.jpg" height="150px" width="128px"><br>
           <b>Page 6</b>
           <input OnClick="SuppJpg('006');" type="image" src="Img/PetitDelete.gif"> 
          </div>         
 
    </div>
   </div>
  </fieldset>

j'ai créer deux input text et je voudrais voir dans le premier 1,2,3,4,5,6 et dans le deuxieme 7,8 (1,2,3,4,5,6 étant la permière ligne d'images de mes div)

**SpaceFrog** · 26/06/2006, 15h39

la répartition entre les deux inputs se fait comment ?

**PrinceMaster77** · 27/06/2006, 09h18

Justement c'est dans ma fonction javascript que je coince pour la répartiion et pour trouver la première ligne d'image !!!

**PrinceMaster77** · 27/06/2006, 10h25

voici ma fonction, je parviens à boucler sur le nombre de ligne de tous mes div mais les données sont toujours les memes :

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
 
    function OrdrePage(NbFile){
     var array1 = new Array();
     var array2 = new Array();
 
     NbLigne = Math.ceil(NbFile / 6);
 
     for(var n=1; n<=NbLigne;n++){
      for(var i=0; i<=6;i++){
       TabImgs=document.getElementsByTagName('IMG')[i].id
       TabDivs=document.getElementsByTagName('DIV')[i].id
 
       alert(TabImgs);
 
      //array1.push(TabDivs)
      //OrdrePage = 'document.DragAndDrop.OrdrePage'+ n +'.value = array'+ n +'';
      //eval(OrdrePage);      
      } 
     }
    }

mon alert m'affiche toujours 1,7,2,8,3,9 alors que je voudrais 1,2,3,4,5,6 !! et dans mon deuxième passage j'ai toujours 1,7,2,8,3,9 alors que je voudrais 7,8,9,10

Trouver la position d'une image avec getElementsByTagName

JavaScript

Vue hybride

Discussions similaires

Partager

Partager