0
Ich habe einen Code, der sehr schön funktioniert und ich hatte große Hilfe hier. Die einzige Sache ist, dass das Array Spieler Ausgang sind nicht sehr schön miteinander in einer Tabelle aufgereiht.Javascript Array-Ausgabe in Tabelle
Meine Frage ist, wie kann dieser Code (Array-Player-Ausgabe) geändert werden, um es schön aufgereiht zu haben?
<html>
<head>
<title>Lotto van Terwijn</title>
<body>
<p><img src="../lotto/images/terwijn.png" width="547" height="188"></p>
<style type="text/css">
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #000000;
background-color: #FFFFFF;
}
.name {
color: #000000;
font-weight: bold;
margin-right: 0.5em;
}
.picks, .picks * {
display: inline;
margin: 0;
padding: 0;
list-style-type: none;
}
.picks * {
margin: auto 0.25em;
color: Yellow;
}
.win { color: #ffcc00; font-weight: bold }
.loss { color: #ff0000; font-weight: bold }
.drawNum, #Draws H3 {
margin-bottom: 0;
}
</style>
<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++) {
var img = '<img src="http://www.lotto.nl/static/images/ballen/lotto/l'
+ draws[i].picks[j]
+ '.jpg" alt="'
+ draws[i].picks[j]
+ '" />';
html.push("<li>"+img+"</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>
</body>
</html>
ading css auf die Spannweite funktioniert alles sehr gut, ist der einzige Gedanke, dass die Zahlen selbst nicht wirklich aufgereiht sind. Ich denke, weil sie in einer Reihe sind, gibt es eine Möglichkeit, sie einzeln aufzustellen? Ich persönlich weiß nicht, wie Sie es in einer Tabelle mit Javascript implementieren. Ich habe es mit document.print gesehen, aber ich denke, das passt nicht in diese Art von Codierung. – Chris