1

誰かが私のために比較スクリプトを作成してくれましたが、本来あるべきように機能しています。

このウェブサイトを見てください、これは何千もの言葉を説明します

このウェブサイトの機能は、宝くじ/ビンゴの数字をチェックすることです。各抽選日 (1 日目と 2 日目) は、プレイしているすべての人と比較する必要があります。一部の数字は緑色ですが、すべての数字が緑色であるとは限りません。これらの数字は、プレーヤー リストのいくつかの数字と一致するため、緑色である必要があります。繰り返しますが、私が十分に明確ではなかったので、それは私自身の責任でした。DRAW var 内のすべての数値をチェックする代わりに、最後に追加された var DRAW のみをチェックするようにするには、どの部分を置き換えるか編集する必要があるか教えてください。

http://www.coldcharlie.nl/lotto/

これが関数部分です。

function checkArray(guesses, draw) {
    var results = {}
    for (var i = 0; i< guesses.length; ++i) {
        if (draw.picks[guesses[i]]) {
            results[guesses[i]] = 'win';
        } else {
            results[guesses[i]] = 'loss';
        }
    }
    return results;
}

function appendTo(elt, parent) {
    if (parent) {
        document.getElementById(parent).appendChild(elt);
    } else {
        document.body.appendChild(elt);
    }
}

function printResults(name, winloss, parent) {
    var resultElt = document.createElement('div');
    resultElt.appendChild(document.createElement('span'));
    resultElt.firstChild.appendChild(document.createTextNode(name));
    resultElt.firstChild.className='name';
    var picks = document.createElement('ol');
    picks.className='picks';
    for (var p in winloss) {
        picks.appendChild(document.createElement('li'));
        picks.lastChild.appendChild(document.createTextNode(p));
        picks.lastChild.className = winloss[p];
    }
    resultElt.appendChild(picks);
    appendTo(resultElt, parent);
}

function printResultsFor(name, draw, parent) {
    printResults(name, checkArray(players[name], draw), parent);
}

function printDraw(which, draw, parent) {
    var drawElt = document.createElement('div');
    drawElt.className='draw';
    drawElt.appendChild(document.createElement('h3'));
    drawElt.lastChild.appendChild(document.createTextNode('Draw '+which));
    drawElt.lastChild.className='drawNum';
    drawElt.appendChild(document.createElement('div'));
    drawElt.lastChild.className='date';
    drawElt.lastChild.appendChild(document.createTextNode(draw.when));
    var picks = document.createElement('ol');
    picks.className='picks';
    for (var p in draw.picks) {
        picks.appendChild(document.createElement('li'));
        picks.lastChild.appendChild(document.createTextNode(p));
    }
    drawElt.appendChild(picks);
    appendTo(drawElt, parent);
}

これはHTML部分です

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <head>
    <style type="text/css">
      body {
        font-family: Verdana, Arial, Helvetica, sans-serif;
        color: white;
        background-color: #333;
      }
      .name {
        color: white;
        font-weight: bold;
        margin-right: 0.5em;
      }
      .picks, .picks * {
        display: inline;
        margin: 0;
        padding: 0;
        list-style-type: none;
      }
      .picks * {
        margin: auto 0.25em;
      }
      .win { color: lime; }
      .loss { color: red; }
      .drawNum, #Draws H3 {
          margin-bottom: 0;
      }
    </style>
    <script type="text/javascript" src="lotto.js"></script>
  </head>
  <body>
    <div id="Results"></div>
    <div id="Draws"></div>
    <script type="text/javascript">
    var players = {John: ["2","3","8","12","23", "37", "41", "45", "48"],
                   Michael: ["2","14","3","12","24", "37", "41", "46", "48"]};

    var draws = [ {when: 'Sat 08-08-2009',
                   picks:{2:1, 5:1, 11:1, 16:1, 23:1, 45:1, 46:1}},
                  {when: 'Sat 15-08-2009',
                   picks:{1:1, 23:1, 11:1, 14:1, 23:1, 42:1, 46:1}}];
    draws.last = draws[draws.length-1];

    for (name in players) {
      printResultsFor(name, draws.last, 'Results');
    }
    for (var i=0; i<draws.length; ++i) {
      printDraw(i+1, draws[i]);
    }
    </script>
  </body>
</html>
4

1 に答える 1

2

別の提案があります：

  1. jqueryを使う
  2. 各プレーヤー番号がその番号を含むクラスのスパンを持つように html を生成します。たとえば、37 は次のように記述されます。<span class='pick37'>37</span>
  3. クレイジーな配列ロジックを取り除き、当選番号と一致するすべてのクラスの色を緑に設定するループを 1 つだけ用意します。

編集：私はあなたの問題を見ました。その実装を思いついた人は、それをこれ以上複雑にすることはできませんでした. 私はあなたの問題を突き刺したかったのですが、書き換えがより簡単/高速になる場合にそのコードを操作しようとする正当な理由はありません.

そのコードがそのままである理由はありますか？

edit2:気分が良かったので書き直しました: こちらからも入手できます: http://dogself.com/test.htm

このことから何かを学んでいただければ幸いです。

<html>
<head>
<title>Bingo stuff</title>
<body>
<style type="text/css">
      body {
        font-family: Verdana, Arial, Helvetica, sans-serif;
        color: white;
        background-color: #333;
      }
      .name {
        color: white;
        font-weight: bold;
        margin-right: 0.5em;
      }
      .picks, .picks * {
        display: inline;
        margin: 0;
        padding: 0;
        list-style-type: none;
      }
      .picks * {
        margin: auto 0.25em;
      }
      .win { color: lime; }
      .loss { color: red; }
      .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","44"],
                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","32"],
                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: 'Sat 08-08-2009',
               picks:[2, 5, 11, 16, 23, 45, 46]
              },
              {
               when: 'Sat 15-08-2009',
               picks:[1, 23, 11, 14, 23, 42, 46]
              }
            ];

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'>","<h3 class='drawNum'>Draw "+(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>
</body>
</html>
于 2009-08-18T20:22:52.140 に答える