如何将不同的名称放入自动生成的文本框中，以便我可以使用复选框将文本放入其中

Question

这是JavaScript

$(document).ready(displayCheckbox);

Countmessage = [];

function displayCheckbox() {

$("input:checkbox").change(function() {

 message = [];

    notmessage = [];

    Countmessage.length = 0; // clear selected cb count
    $("input:checkbox").each(function() {
      if ($(this).is(":checked")) {
        Countmessage.push($(this).attr("id"));
      }
    });

    $('input[name=message]').val(Countmessage);
  });
}

这是表格HTML

            <th>Full Name</th>
            <th>Student's Contact No.</th>
            <th>Guardian No.</th>
            <th>Message</th>
            <th>hehe boi</th>
            <th>Quiz</th>
            <th>Test</th>
            <th>Performance Task</th>

下面是我的PHP代码

if ($resultcheck > 0){

    while($student = mysqli_fetch_assoc($record)){

            echo "<tr>";

            echo "<td>".$student['fname']."</td>";

            echo '<td> <input type="text" name="number" value='.$student['scn'].'><br/> </td>';

            echo '<td> <input type="text" name="number1" value='.$student['gcn'].'><br/> </td>';

            echo "<td>"."<input type='text' name='message'+i/>"."</td>";

            echo "<td>"."<input type='checkbox' id='Good day'/>"."</td>";
            echo "<td>"."<input type='checkbox' id='Quiz'/>"."</td>";
            echo "<td>"."<input type='checkbox' id='Test'/>"."</td>";
            echo "<td>"."<input type='checkbox' id='Performance Task'/>"."</td>";

            echo "<tr>";    

}
}

我的问题是，当我选中1复选框时，它将文本输入到所有第3文本框中。我希望每当我在第一行中选中一个复选框时，它都只会在表的第1行文本框中输入消息。 看看这个看看iam在说什么（里面的数据都存储在db中）

Answer 1

您的问题是您的选择器正在选择第3列中的所有复选框。此位：

$('input[name=message]').val(Countmessage);

这将选择所有名称为message的复选框，其中每一行都有一个。

因此，只需使用事件目标而不是选择器即可：

$("input:checkbox").change(function(event) {

 message = [];

    notmessage = [];

    Countmessage.length = 0; // clear selected cb count
    $("input:checkbox").each(function() {
      if ($(this).is(":checked")) {
        Countmessage.push($(this).attr("id"));
      }
    });

    $(event.target).val(Countmessage);
  });
}