需要有关 Javascript 编码转换以使用我的 html 表的帮助

Question

我有一个表格，其中的行数取决于微调器中的数字。这确实有效，例如，如果我在微调器中输入 25，它会出现 25 行，如果我在微调器中输入 7，则会出现 7 行。这是通过 $spinnerCount 检索的。

问题是每次我向表中提交问题（使用 textarea 并提交按钮来输入和提交问题）时，它都会创建一个新行。因此，如果我在表中有 20 个空行，因为我在微调器中声明我想要 20 个问题，那么每次我提交问题时会发生什么，它每次都会添加一个新行，所以从 textarea 提交 20 个问题将意味着表将包含 20 个空白行和 20 个带问题的行。我猜是因为这个，例如：

var enumeratorCell = document.createElement("td");

所以除了创建一个元素来创建一个新行之外，我想检索一个元素，以便它在现有行中提交问题（每行包含一个文本框，因此问题将进入该行中的文本框）开始每次提交问题时从顶行向下一行，而不是每次提交问题时创建一个新行。问题将位于“问题”列下。

现在有人（用户：nnnnn）向我发布了这个：

以下是用户自己编写的表格示例：

<table id="myTable">
   <tr>
      <td>1</td>
      <td>2</td>
   </tr>
   <tr>
      <td>3</td>
      <td>4</td>
   </tr>
</table>

下面是用户的javascript：

//If you want to retrieve or change the contents of the existing cells you can do this:

// get reference to the table
var t = document.getElementById("myTable"),
    r,
    c,
    i, j;

// loop through the rows
for (i=0; i<t.rows.length; i++) {
   // get reference to current row
   r = t.rows[i]; //
   // loop through tds of current row
   for (j=0; j<r.cells.length; j++) {
       // get reference to current cell
       c = r.cells[j]; // equivalent to t.rows[i].cells[j]
      // display content of cell
      alert(c.innerHTML);
      // change content of cell
      c.innerHTML = "New value " + i + j;
    }
}

问题是我试图在我的代码中操纵它，但#i 无法让它工作。这样做的原因是因为我不知道在我的表中使用这个 javascript。所以我想知道的是有人可以操纵这个 javascript 代码使其与我的表匹配吗？

下面是我的表格和输入和提交问题的文本区域的代码：

//我的桌子

<table id="qandatbl" align="center">
    <thead>
    <tr>
    <th><span id="qidhead">Question No</span></th>
    <th><span id="questionhead">Question</span></th>
    <th><span id="optionshead">Option Type</span></th>
    <th><span id="durationhead">Duration</span></th>
    <th><span id="weighthead">Weight(%)</span></th>
    <th><span id="answerhead">Answer</span></th>
    <th><span id="videohead">Video</span></th>
    <th><span id="audiohead">Audio</span></th>
    <th><span id="imagehead">Image</span></th>
    </tr>
    </thead>
    <tbody>
    <?php
    $spinnerCount = $_POST['textQuestion'];
if($spinnerCount > 0) {
   for($i = 1; $i <= $spinnerCount; $i++) {?>

    <tr>
    <td class="qid"><?php echo $i; ?></td>
    <td class="question"></td>
    <td class="options"></td>
    <td class="duration"></td>
    <td class="weight"></td>
    <td class="answer"></td>
    <td class="video"></td>
    <td class="audio"></td>
    <td class="image"></td>
    </tr>
    </tbody>
    <?php
}
}
?>
</table>

//textarea和submit按钮，输入问题和提交的地方，textarea和submit按钮放在上表下方

<form id="enter" action="<?php echo htmlentities($_SERVER['PHP_SELF']); ?>" method="post">
<table id='middleDetails' border='1'>
<tr>
<th class='tblheading' colspan='2'>SESSION DETAILS</th>
</tr>
<tr>
<td id="questionContent">Question:</td> 
<td id="questionTextarea"><textarea rows="5" cols="40" id="questionTxt" name="questionText"></textarea></td>
</tr>
<tr>
<td id="addQuestionRow" colspan='2'><input id="addQuestion" type="button" value="Add Question" name="addQuestionBtn" onClick="insertQuestion()" /></td>
</tr>
</table>
</form>

Answer 1

给你的占位符行一个“空白”类...为你添加的每一行删除一个空白。

Answer 2

看起来你没有得到你的表格元素。

改变

var t = document.getElementById("myTable"),

到

var t = document.getElementById("qandatbl"),

我认为应该这样做。

在 cmets 中回答您的问题： 将<?php echo $i; ?>移到问题栏<td class="question"><?php echo $i; ?></td>