Select image en javascript

**daly1589** · 07/03/2014, 17h13

Bonjour tout le monde,

Je suis débutante en javascript ...je voudrais réaliser un select qui affiche des image comme dans ce tuto

http://www.flowsim.se/picts/iljjava/eiljsele.html

Le problème c'est qu'en suivant ce qu ils recommandent rien ne s'affiche...je remplace le mot iljblid par une photo, exemple : http://upload.wikimedia.org/wikipedi...Stonehenge.jpg j'enleve le JPG...pour le mettre après comme il demande mais rien n'y fait !!!!

**NoSmoking** · 08/03/2014, 15h57

Bonjour et bienvenue sur DVP.
La meilleur des choses que tu puisses faire c'est de nous mettre le code que tu as réalisé/modifié.

**daly1589** · 10/03/2014, 14h04

voici mon code:

Code html :

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

1
2
3
4
5
6
 <select id="changeImage">
  <option value="0">image 0</option>
  <option value="1">image 1</option>
  <option value="2">image 2</option>
</select>
<img id="image" src='//C:Users/FRAME/Desktop/pic/1.jpg'>

Code :

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

1
2
3
4
5
6
7
8
9
var imagesArray = [
  "//C:Users/FRAME/Desktop/pic/1.jpg"
   "//C:Users/FRAME/Desktop/pic/2.jpg"
  "//C:Users/FRAME/Desktop/pic/2.jpg" 
];
 
$('#changeImage').change(function(){
  $('#image')[0].src = imagesArray[this.value];
})

Mes photos ne s'affichent pas!
j'ai essaye ca aussi! qui marche sur le simulateur w3schools mais pas mes navigateur...

Code html :

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
<!doctype html>
 
<html lang="fr">
  <head>
 
    <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
 
  <select id="changeImage">
    <option>cf5</option>
    <option>f1f</option>
    <option>444</option>
  </select>
  <img id="image" src='//placehold.it/50x50/cf5'>
 
	<script type="text/javascript">
        $('#changeImage').change(function(){
  $('#image')[0].src = "//placehold.it/50x50/"+this.value;
});
    </script>
 
  </body>
</html>

**blinkman04** · 13/03/2014, 12h58

Petite question bête, quand tu inspecte t'a page à l'aide de ton navigateur. Pas d'erreur comme quoi les chemins de tes images sont incorrecte ? Première chose à vérifier pour moi ^^

**SpaceFrog** · 13/03/2014, 15h08

un src d'image ne connait pas le type de path que tu essayes de lui fournir ...

regarde du coté du protocole file://

**NoSmoking** · 13/03/2014, 19h10

Si on reprend ton SELECT

Code html :

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

1
2
3
4
5
<select id="changeImage">
    <option>cf5</option>
    <option>f1f</option>
    <option>444</option>
</select>

on s’aperçoit que tes OPTIONs n'ont pas de value, donc comment veux tu récupérer la value du SELECT, même si dans l'absolue jQuery te sauve si tu utilises $(this).val().

Tu devrais réorganiser tes répertoires afin de ne pas avoir des paths contenant des //C:Users/FRAME par exemple.

**SpaceFrog** · 14/03/2014, 10h11

Nosmo => c'est pssoble à partir du text ou du selected index car les paths sont dans un array ...

Mais il est clair que ce serait plus simple avec un value ..

Select image en javascript

jQuery

Discussions similaires

Partager

Partager