Connaître l'index d'une valeur dans un tableau

**chok371** · 23/01/2011, 23h23

Bonjour,

J'aimerais pouvoir stocker dans une variable l'index d'une valeur d'un tableau.

Exemple :

Code :

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

var tab = ["a", "b", "c", "d"];

Si le tableau contient, par exemple, une liste d'images, je sais que je pourrais faire :

this.src;

Ça va me retourner l'src de l'image sur laquelle je clique. Si j'aurais fais "this.id" ça m'aurait retourner l'id de l'image. Mais si je veux qu'on me retourne la position de cette image dans le tableau (si elle est dans l'index 0, 1, ou 2...), comment faire ? Est ce qu'il existe un "this.index" ?

Comment faire pour stocker dans une variable la position de l'élément du tableau sur lequel on vient de cliquer ?

Merci.

**SpaceFrog** · 24/01/2011, 09h52

Cela suppose l'unicité de tes éléments d'array... ou alors ton arrayIndex devra retourner un tableau

Mais on peut imaginer un prototype du genre:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
Array.prototype.arrayIndex=function(valeur){
var i=-1;
var indexes = new Array();
while (this[++i]){
	if (this[i]===valeur){
		indexes.push(i);}
 }
return (indexes.length>0)? indexes:-1;
}		
 
var tab = ["a", "b", "c", "d","b"];
 
alert(tab.arrayIndex('b'))

retourne un tableau des indexes correspondants à la valeur recherchée, ou -1 si pas d'occurrences

**Bovino** · 24/01/2011, 10h47

A noter qu'il existe aussi la méthode indexOf() pour les array, mais elle n'est pas compatible IE

**RomainVALERI** · 24/01/2011, 11h07

Envoyé par Bovino

A noter qu'il existe aussi la méthode indexOf() pour les array, mais elle n'est pas compatible IE

...auquel cas on peut également la redéfinir en s'inspirant par exemple de Prototype ^^
(c'est ce que j'ai fait de mon côté suite je crois à un conseil de vermine

)

Code javascript :

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

1
2
3
4
5
6
7
8
9
// rustine tirée de Prototype (merci les gars ^_^') pour assurer Array.indexOf dans IE
if (!Array.prototype.indexOf) Array.prototype.indexOf = function(item, i) {
  i || (i = 0);
  var length = this.length;
  if (i < 0) i = length + i;
  for (; i < length; i++)
    if (this[i] === item) return i;
  return -1;
}

**NoSmoking** · 24/01/2011, 14h16

on peut également passer par les tableaux associatifs
petit exemple pour illustrer

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
<html>
<head>
</head>
<body>
  <img src="img/image1.jpg">
  <img src="img/image2.jpg">
  <img src="img/image3.jpg">
  <img src="img/image4.jpg">
</body>
<script type="text/javascript">
// le tableau 
var tImage = [];
// la fonction de lecture
function getIndex( tab, ref){
  return tab[ ref] ? tab[ ref] :-1;
}
// la recuperation et initialisation
for( var i=0, nb =document.images.length; i < nb; i++){
  var oImg = document.images[i];
  // affectation
  tImage[oImg.src] = i+1;
  // fct sur click pour voir
  oImg.onclick = function(){
     alert( 'image n° ' +getIndex( tImage, this.src));
  }
}
</script>
</html>

à condition de l'avoir initialisé au paravent.

**javatwister** · 24/01/2011, 21h07

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
<script type="text/javascript">
 
var tab = ["un", "deux", "trois", "quatre","cinq"];
 
function cherch(n){
	for(i in tab){
		if(tab[i]==n){
			alert(n + "\n\na été trouvé à l'index " + i + " du tableau");break;
		}
	}
}
 
cherch("trois");
 
</script>

**chok371** · 26/01/2011, 03h31

Envoyé par SpaceFrog

Cela suppose l'unicité de tes éléments d'array... ou alors ton arrayIndex devra retourner un tableau

Mais on peut imaginer un prototype du genre:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
Array.prototype.arrayIndex=function(valeur){
var i=-1;
var indexes = new Array();
while (this[++i]){
	if (this[i]===valeur){
		indexes.push(i);}
 }
return (indexes.length>0)? indexes:-1;
}		
 
var tab = ["a", "b", "c", "d","b"];
 
alert(tab.arrayIndex('b'))

retourne un tableau des indexes correspondants à la valeur recherchée, ou -1 si pas d'occurrences

Merci !

Par contre, ça ne marche pas sur mon script...

J'ai un tableau qui se nomme cibleImg et qui contient pleins d'images.

Quand je fais this.src, je reçois le chemin de l'image sur lequel j'ai cliqué.

Mais quand j'utilise ta fonction et fais :

Code :

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

alert(cibleImg.arrayIndex(this.src))

Le script ne fonctionne plus.

**Bovino** · 26/01/2011, 08h57

Peut être que cibleImg n'est pas vraiment un tableau.

**SpaceFrog** · 26/01/2011, 09h30

à condition de l'avoir initialisé au paravent.

pour se planquer derrière ??
ne pas confondre auparavant et un paravent

array, objet collection ...
on peut le voir ce mystérieux objet ?

**NoSmoking** · 26/01/2011, 11h20

Envoyé par SpaceFrog

pour se planquer derrière ??
ne pas confondre auparavant et un paravent

on eut pu croire à de l'humour, mais il n'en est rien c'est bien une coquille...

Concernant le sujet traité, il y a encore la possibilité d'utiliser l'attribut tabIndex, même si non valide W3C, celui ci étant supporté sur les IMG par les navigateurs.

Le script que j'ai proposé devenant

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
// le tableau 
var tImage = [];
// la fonction de lecture
function getIndex( tab, ref){
  return tab[ ref] ? tab[ ref] :-1;
}
// la recuperation et initialisation
for( var i=0, nb =document.images.length; i < nb; i++){
  var oImg = document.images[i];
  var index = i+1;
  // affectation
  tImage[oImg.src] = index;
  // ajout tabindex
  oImg.setAttribute('tabIndex', index);
  // fct sur click pour voir
  oImg.onclick = function(){
     alert( 'image n° ' +getIndex( tImage, this.src) +'\ntabIndex : ' +this.getAttribute('tabIndex'));
  }
}

par exemple

**chok371** · 26/01/2011, 20h41

Merci !

Connaître l'index d'une valeur dans un tableau

JavaScript

Discussions similaires

Partager

Partager