javascript Remplacer la sortie du numéro de tableau avec une image

Question

J'ai un code wich modifier comme Id pour produire une image au lieu d'un nombre

L'image ne doit être affichée pour que l'on appelle la sortie de sélection. Il y a une structure dans les images que je voudrais utiliser, donc si quelqu'un peut être si agréable d'avoir 1 ou 2 expliqué, je peux faire l'autre 43 :)

Exemple, voici un exemple de travail de la code jusqu'ici. Ce que je veux c'est que quand un choix de nombre est par exemple 6, cette image sera affichée alt text http://www.lotto.nl/static/images/ballen/lotto/l6.jpg S'il vous plaît ne vous inquiétez pas pour les droits d'auteur, je vais faire mes propres boules lorsque la conception du code est terminée.

Toute aide serait géniale.

<script type="text/javascript" src="http://jquery.com/src/jquery-latest.js"></script> 

<div id="players"></div> 
<div id="draws"></div> 

<script type="text/javascript"> 

var players = { 
Joop : ["6","8","16","18","26","28","32","36","38","41"], 
Marijke: ["7","10","14","18","24","29","30","34","39","40"], 
Michel : ["4","5","11","16","21","27","33","36","42","44"], 
Mario : ["6","9","18","25","32","35","39","40","43","45"], 
Diana : ["2","6","8","17","22","23","33","36","42","45"], 
Agnes : ["3","5","10","15","26","29","32","37","41","44"], 
Chris : ["5","7","8","9","11","12","16","28","30","32"], 
Jeannette: ["1","2","4","7","8","11","13","28","30","38"], 
Wieger: ["1","2","3","7","10","13","14","22","23","27"], 
Anita: ["6","13","15","17","21","26","32","33","43","45"], 
Thea: ["1","3","5","7","10","17","19","20","22","38"], 
Danny: ["3","7","11","15","22","28","32","37","40","43"], 
Cindy: ["2","4","16","18","21","24","33","38","41","44"], 
Hanneke: ["1","3","4","12","18","21","25","30","36","40"], 
Willem: ["3","9","17","21","27","33","35","39","41","42"] 
}; 

var draws = [ { 

when: 'Datum: Zaterdag 08-08-2009', 
picks:[2, 13, 15, 18, 21, 41] 
}, 

{ 
when: 'Datum: Zaterdag 15-08-2009', 
picks:[6, 19, 24, 25, 35, 37] 
}, 

{ 
when: 'Datum: Zaterdag 22-08-2009', 
picks:[8, 17, 23, 26, 37, 42] 
} 
]; 

var buildPlayers = function(){ 
var cont = $("#players"); 
for(player in players){ 
var html = ["<div>","<span class='name'>"+player+"</span>", "<ol class='picks'>"]; 
for(var i = 0; i < players[player].length; i++){ 
html.push("<li class='loss pick_"+players[player][i]+"'>"+players[player][i]+"</li>"); 
} 

html.push("</ol>","</div>"); 
cont.append(html.join("")); 
} 
}; 

var buildDraws = function(){ 
var cont = $("#draws"); 
for(var i = 0; i < draws.length; i++){ 
var html = ["<div class='draw'>","<h4 class='drawNum'>Trekking "+(i+1)+"</h3>","<div class='date'>"+draws[i].when+"</div>","<ol class='picks'>"]; 
for(var j = 0; j < draws[i].picks.length; j++){ 
html.push("<li>"+draws[i].picks[j]+"</li>"); 
showWin(draws[i].picks[j]); 
} 
html.push("</ol>","</div>"); 
cont.append(html.join("")); 
} 
}; 

var showWin = function(winNum){ 
$(".pick_"+winNum).removeClass("loss").addClass("win"); 
}; 

$(function(){ 
buildPlayers(); 
buildDraws(); 
}); 
</script> 

Answer 1

Modifier cette

for(var j = 0; j < draws[i].picks.length; j++) { 
     html.push("<li>"+draws[i].picks[j]+"</li>"); 
     showWin(draws[i].picks[j]); 
    } 

à

for(var j = 0; j < draws[i].picks.length; j++) { 
     var img = '<img src="/images/ball-' 
        + draws[i].picks[j] 
        + '.jpg" alt="' 
        + draws[i].picks[j] 
        + '" />'; 
     html.push("<li>"+img+"</li>"); 
     showWin(draws[i].picks[j]); 
    } 

en supposant que vos images sont nommées "# Ball-" et situé dans le répertoire des images.