javascript - 单击单选按钮时使用 PHP 启用禁用文本字段

Question

我有 2 个单选按钮(启用/禁用)和 3 个文本框。如果单击禁用单选按钮，我想禁用 3 个文本框。

<Input type = 'Radio' Name ='target' value= 'r1'>Enable 
<Input type = 'Radio' Name ='target' value= 'r2'>Disable 
T1: <input type="text" name="t1"> 
T2: <input type="text" name="t2"> 
T3: <input type="text" name="t3">

一旦我选择其中一个单选按钮，就会发生此更改。我正在使用 PHP。 TIA!

Answer 1

尽管使用 jQuery 会更容易，但以下是纯粹用 JavaScript 实现的一种方法:

let textboxes = document.querySelectorAll('input[type=text]');

document.querySelectorAll('input[name=target]')
  .forEach(function(radio) {
    radio.addEventListener('change', function(e) {
      let value = e.target.value;

      if (value === 'r1') {
        textboxes
          .forEach(function(textbox) {
            textbox.disabled = false;
          });
      } else if (value === 'r2') {
        textboxes
          .forEach(function(textbox) {
            textbox.disabled = true;
          });
      }
    });
  });

<Input type='Radio' Name='target' value='r1'>Enable
<Input type='Radio' Name='target' value='r2'>Disable
<br><br>

T1: <input type="text" name="t1">
T2: <input type="text" name="t2">
T3: <input type="text" name="t3">

它基本上监听单选按钮的 change 事件，并循环遍历文本框以启用/禁用它们。