Javascript HTML輸入數組PHP

Question

我正在設計一個Web應用程序，並陷入了輸入表單中。

我有一個服務清單，我正在用php這樣動態顯示，

while($row=$result->fetch_assoc())
{
extract($row);
echo "<td>$service</td>";

echo "<td><input type='checkbox' name='ac[]'>'</td>";
echo "<td><input type='text' name='as[]' disabled>'</td>";
echo "<td><input type='text' name='ad[]' disabled>'</td>";
}

現在，此操作是依次打印至少10或20個服務名稱，並在每個名稱旁邊打印一個復選框和兩個文本框以進行輸入。

現在，我要做的就是使文本框被禁用，除非我選中該復選框。

這可能嗎？ 我需要協助。

Answer 1

在Gyney Saramali的答案的基礎上，下面的Javascript既可以在選中復選框時也可以在未選中時起作用。

$('.checkbox').click(function(){
  var state = $(this).parents('td').siblings('td').children('input[type=text]').attr('disabled');
  $(this).parents('td').siblings('td').children('input[type=text]').attr('disabled', !state);
});

解釋jQuery代碼：

$(this) refers to the check box that was clicked.
.parents('td') refers to the parent object of the checkbox (IOW, the td containing the checkbox).
.siblings('td') refers to the siblings of the td.
.children('input[type=text]') refers to the contents of the td's, just the input fields of type text.
.attr('disabled',!state) sets the state of the disabled attribute. The variable state is the current state of the text fields and the ! invert the value. If false, it makes it true, and if true, makes it false.

Answer 2

這是一個現場演示。 我所做的是給您的復選框上課，然后單擊，我找到輸入並將Disabled屬性更改為false。

HTML

<table>
  <tr>
    <td><input type='checkbox' name='ac[]' class="checkbox"></td>
    <td><input type='text' name='as[]' disabled></td>
    <td><input type='text' name='ad[]' disabled></td>
  </tr>
  <tr>
    <td><input type='checkbox' name='ac[]' class="checkbox"></td>
    <td><input type='text' name='as[]' disabled></td>
    <td><input type='text' name='ad[]' disabled></td>
  </tr>
  <tr>
    <td><input type='checkbox' name='ac[]' class="checkbox"></td>
    <td><input type='text' name='as[]' disabled></td>
    <td><input type='text' name='ad[]' disabled></td>
  </tr>
</table>

JS

$('.checkbox').click(function(){
  $(this).parents('td').siblings('td').children('input').attr('disabled', false);
});