连续的最后一个按钮丢失了

时间:2012-01-13 23:10:50

标签: jquery loops

我有一个jquery循环,它显示按钮A - Z,但它的作用是连续显示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>

1 个答案:

答案 0 :(得分:0)

[忽略]

$newBtn+"<tr></tr>" 那是一个jQuery实例+ String。 我认为这就是问题所在。 尝试将newBtn作为字符串保留到最后$answer.append($(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