Javascript 如何在新表格行列下显示我的答案

我有一个应用程序，您可以在我的JSFIDLE中测试它，看看它是如何工作的。现在，这个应用程序允许用户为每个问题选择选项和答案，JSFIDLE上的应用程序不会显示问题，因为这个问题不需要它

现在，用户选择一个选项，输入他/她想要的答案数量，然后从下面的按钮中选择答案。用户将添加一个问题，然后表格中会出现一个新行，显示所选答案

关于如何使用该应用程序以便您可以在JSFIDLE中亲自尝试的示例：

打开轴网打开轴网链接并选择选项4

在回答数文本框NumberTranswerTXT中键入数字2

选择按钮A和C

单击添加问题按钮

现在，正如您所看到的，出现了一个新的表格行，但Answer2列下除了一个空文本框之外没有其他内容。不需要文本框

我想要的是答案按钮的精确副本，如果您遵循fiddle中的示例，则当答案提交到新表行时，其按钮A到D（选择A和C）将显示在答案列中。我想显示它的按钮，因为他们是，但我绝对不知道如何做到这一点

有人知道怎么做吗

控制“答案”列的新表格行的代码如下：

cell = document.createElement("td");
 cell.className = "answer";
 input = document.createElement("input");
 input.name = "answer_" + qnum;
 cell.appendChild(input);
 row.appendChild(cell);

---

这可以在函数insertQuestionform中找到，该函数位于JSFIDLE Javascript部分末尾附近。

我不确定您是否想到了这一点，但是下面修改的函数会将所选按钮复制到新行，而不包含on/off类和事件。根据需要通过添加其他类进行调整，以获得完全符合您需要的样式。注意：我建议您不要像现在这样直接在元素上设置style属性。使用CSS来实现这一点就足够了，也许可以使用规则：nth child来获得所需的包装。在上查看更新的小提琴

---

我确实提前表示歉意，因为小提琴中有很多代码，但是让应用程序在小提琴中工作需要这些代码。嗯，我想我可能已经覆盖了你的小提琴：-对不起。@jjmontes，你不能，所以不要担心。@jimontes，对不起，刚刚吃了我的晚餐，如果您希望jquery是一个非常好的尝试，并且接近于解决问题，那么可以使用jquery。事实上，我想复制“答案”按钮的功能以及从上面的答案中选择的功能，以显示在“答案”菜单下的新表格行中。原因是如果你添加了答案，然后你意识到你在其中一行中犯了错误，您可以通过取消选择一个按钮并选择另一个按钮来更改该答案行中的答案。将来，我想在选项列下添加选项网格，并在答案数行下添加答案数文本框，以便在每个表行中都可以看到确切的函数。希望你明白我的意思。希望这能让你朝着正确的方向开始。只需查看上一节中当前正在做的事情，并根据需要添加类/处理程序，以获得所需的行为。

// make the counter global so that it isn't reset with each function call,
// though it looks like you could get it from an input on the page.  That
// or figuring out the next number from the existing rows would be better.
var qnum = 1;
function insertQuestion(form) {
    // make the row
    var $html = $("<tr><td class='qid'>" + qnum + "</td></tr>");
    // make the column element where the answers will go
    var $td = $("<td class='answer'></td>");
    // for each selected answer button, construct a new one and append it to the column
    $('#optionAndAnswer .answerBtnsOn').each( function() {
        var $this = $(this);
        var $newBtn = $("<input class='answerBtns' type='button' style='display: inline-block;' />").attr('name',$this.attr('name'))
                   .attr('value',$this.attr('value'))
                   .attr('id','qid' + qnum + '-' + $this.attr('id')); // must be unique
        $td.append($newBtn);
    });
    // add column to row
    $html.append($td);
    // add row to table and update counter
    $('#qandatbl').append($html);
    form.numberOfQuestions.value = qnum;

    ++qnum;
    $("#questionNum").text(qnum);
    form.questionText.value = "";

}