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

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

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, 08h52

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, 09h47

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

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

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, 13h16

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, 20h07

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, 02h31

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, 07h57

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

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

à 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, 10h20

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, 19h41

Merci !

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

JavaScript

Discussions similaires

Partager

Partager