値に基づいて動的にfadeInhtmlを返します

Question

私はjqueryを使用して、バスケットボールシリーズの受賞者に基づいてコンテンツを動的にフェードインします。したがって、例えば、NBA東部会議の決勝戦を取ることができます。それは7シリーズのベストです。 4つのゲームで勝つための最初のチームがシリーズを勝ちます。したがって、最初の入力タグの場合、ユーザーはChicago Bullを勝者として選択します。第2のゲームでは、ユーザはマイアミヒートを勝者として選択する。これまでの結果に基づいて、jqueryは追加の入力タグをフェードインする必要があります。なぜなら、明らかにシリーズは少なくとも5ゲームになるからです。

これは非常に基本的なものです。しかし、クライアントがゲームの勝者を編集してそれに応じてそれを消していくように、これを行う方法について誰かが考えて食べ物を持っているだろうか。私は多くの条件文を使ってこれを行うことができますが、もっと効率的なアプローチに関連するので、思考のために食べ物を得たいと本当に思っています。あなたは、フォームを持っている

<script type="text/javascript"> 
$(document).ready(function(){ 
    var data = <?php echo $teamone_ac; ?>; 
    var soulja = <?php echo $teamtwo_ac; ?>; 

    var away_team_other = $('.away_team_other').html(); 
    var home_team_other = $('.home_team_other').html(); 

    var away_team_wild = $('.away_team_wild').html(); 
    var home_team_wild = $('.home_team_wild').html(); 

    $("#game_one_other").autocomplete({ source: data }); 
    $("#game_two_other").autocomplete({ 
     source: data, 
     select: function(event, ui) 
     { 
      var game_one_other = $('#game_one_other').val(); 
      var game_two_other = ui.item.value; 
      var game_three_other = $('#game_two_other').val(); 

      var arr = [game_one_other, game_two_other, game_three_other,  game_four_other, game_five_other]; 

      var away = away_team_other; 
      var home = away_home_other; 

      var numAway = $.grep(arr, function (elem) { 
       return elem === away; 
      }).length; 

      var numHome = $.grep(arr, function (elem) { 
       return elem === home; 
      }).length; 

      if(game_one_other != game_two_other) 
      { 
       $('#one_four').fadeIn('slow'); 
      } 
     } 
    }); 
    $("#game_three_other").autocomplete({ 
     source: data, 
     select: function(event, ui) 
     { 
      var game_one_other = $('#game_one_other').val(); 
      var game_two_other = $('#game_two_other').val(); 
      var game_three_other = ui.item.value; 

      if(game_two_other == game_three_other && game_two_other != game_one_other) 
      { 
       $('#one_four').fadeIn('slow'); 
      } 
     } 
    }); 

    $("#game_one_wild").autocomplete({ source: soulja }); 
    $("#game_two_wild").autocomplete({ source: soulja }); 
    $("#game_three_wild").autocomplete({ source: soulja }); 

    $('#one_four').hide(); 
    $('#one_five').hide(); 

    $('#two_four').hide(); 
    $('#two_five').hide(); 
}); 

Answer 1

。フォームには少なくともn個の要素があります（この場合、n = 4）。各要素はおそらく、ユーザーがいずれかのチームから選ぶことができる選択/ラジオである。

<form id="predictWinners" action="submitPredict" method="POST"> 
    <fieldset id="first"> 
     <legend>Game 1</legend> 
     <input class="prediction" type="radio" name="winner" value="[team 1 here]" /> [team 1 here] 
     <br /> 
     <input class="prediction" type="radio" name="winner" value="[team 2 here]" checked="checked" /> [team 2 here] 
     <br /> 
    </fieldset> 
    <!-- repeat for first 4 --> 
    <input type="submit" value="Submit" /> 
</form> 

1. 計算イベントハンドラを記述

2. が自分onchange方法

   jQuery(document).ready(function(){ 
       jQuery(".prediction").change(function() { 
        gamesNec = findGamesNecessary(); 
        if(gamesNec > 4) 
        { 
         jQuery("fieldset").each(function(index){ 
          if(index > 4 && index <=gamesNec) { jQuery(this).fadeIn() } 
         }); 
        } 
       }); 
   }) 
   

3. にイベントハンドラを追加「予測」のように、選択のそれぞれに意味クラスを取り付けユーザーの選択に基づいて各チームに勝利し、それを最大と比較します。

4. Go through each fieldsetし、それをフェードインが/それは

あなたが必要ですどのように多くの勝利数を把握するためにベストオブ（x）のメソッドを書くことができますが残っているどのように多くに基づいて作成（NBAプレーオフのためにそれはです7、これはあなたのコードはポータブルで拡張可能になります計算する。

bestOf = function(x) { 
    return (x % 2 == 0) ? (x/2) : ((x/2)+0.5) 
} 

findGamesNecessary = function() { 
    seriesLength = 7 
    team1_wins = 0 
    team2_wins = 0 
    //iterate through each user selection and update the wins. Left as an exercise 
    gamesPlayed = team1_wins + team2_wins 
    gamesNecessary = (team1_wins >1 && team2_wins > 1) ? bestOf(seriesLength-gamesPlayed) + gamesPlayed : bestOf(seriesLength) 
    return gamesNecessary; 
} 

• これらは完全に右ではないかもしれないが、私はそれが近いと思う。順列を再生する。適切でQを更新あなたがそれらを理解した後の数式