最後の行のボタンがありません

Question

ボタンA〜Zが表示されるjqueryループがありますが、それは行の7つのボタンを表示します。だから、以下のようになります。

A B C D E F G 
    H I J K L M N 
    O P Q R S T U 
    V W X Y Z 

しかし、問題は、このループは、各行の最後のボタンが不足していることが原因とされていることです。ボタンG、N、Uはありません。私はなぜ彼らが行方不明であるか、これらのボタンと他のボタンを表示するために、以下のコードを修正する方法を知りたい。

var i = 1; 

    $('#optionAndAnswer .answers').each(function() { 
     var $this = $(this); 
     var $newBtn = ''; 
     if($this.is(':visible')){ 
      $newBtn = $("<input class='answerBtnsRow answers' type='button' style='display: inline-block;' onclick='btnclick(this);' />").attr('name', $this.attr('name')).attr('value', $this.val()).attr('class', $this.attr('class')); 
     }else{ 
      $newBtn = $("<input class='answerBtnsRow answers' type='button' style='display: none;' onclick='btnclick(this);' />").attr('name', $this.attr('name')).attr('value', $this.val()).attr('class', $this.attr('class')); 
     } 

        if(i % 7 == 0){ 
       $answer.append($newBtn+"<tr></tr>"); 
      } 
      else 
      $answer.append($newBtn);     
      i = i+1; 
     }); 




PHP CODE: 


<?php 
    $a = range("A","Z"); 
?> 

    <table> 
     <tr> 

    <?php 
     $i = 1; 
     foreach($a as $key => $val){ 
      if($i%7 == 1) echo"<tr><td>"; 
      echo"<input type=\"button\" onclick=\"btnclick(this);\" value=\"$val\" id=\"answer".$val."\" name=\"answer".$val."Name\" class=\"answerBtns answers answerBtnsOff\" style=\"display: inline;\">";  
      if($i%7 == 0) echo"</td></tr>"; 
      $i++; 
     } 
    ?> 
     </tr> 
    </table> 

Answer 1

jQueryのインスタンス+文字列で

$newBtn+"<tr></tr>"を[無視]。 私はそこに問題があると思います。 最終的に$answer.append($(newBtn));になるまでnewBtnを文字列として維持してください。

[/無視]私は、単一の文字列を構築しようと、それが面倒であることが判明

。

次のソリューションは、あなたの本来の意図に近いですが、無効なHTMLフラグメント"</tr><tr>"追加しようとしているのトラップ回避：たぶん設定...

var $this, i=0, $row, $cell; 
$('#optionAndAnswer .answers').each(function() { 
    $this = $(this); 
    if(i%7 == 0) { 
     $row = $('<tr />').appendTo($answer); 
     $cell = $('<td />').appendTo($row); 
    } 
    $("<input class='answerBtnsRow answers' type='button' style='display:%s;' onclick='btnclick(this);' />".replace('%s',$this.is(':visible')?'inline-block':'none')).attr('name', $this.attr('name')).attr('value', $this.val()).attr('class', $this.attr('class')).appendTo($cell); 
    i++; 
}); 

Tested only for synatax errors