ジャバスクリプトはIコードを有する画像

Question

でアレイから多数の出力を交換I'dをWICH出力する代わりに、画像のみ、いわゆるピック出力のために表示されるべき数

の画像を変更したいです。 画像には、使用したい構造がありますので、誰かが1または2を説明するのがうまくいけば、私は他の43を行うことができます：

例を以下に示します。これまでのコード。 http://www.coldcharlie.nl/lotto

数字ピックが6の場合、この画像が表示されますalt text http://www.lotto.nl/static/images/ballen/lotto/l6.jpg著作権について心配しないでください。私はコードデザインが完了したら自分のボールを作ります。

助けがあれば助かります。

<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

変更この

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]); 
    } 

へのあなたのイメージは、 "ボール - ＃" という名前とイメージディレクトリに配置されていると仮定。