js获取表单单选框选中的值

你可以通过以下代码获取单选框选中的值：

var radios = document.getElementsByName('radioName');
var selectedValue;
for(var i = 0; i < radios.length; i++) {
    if(radios[i].checked) {
        selectedValue = radios[i].value;
        break;
    }
}

console.log(selectedValue); // 输出选中的值

其中，`radioName` 为单选框的名称，`radios` 为所有单选框元素的集合，`selectedValue` 用于存储选中的值。通过遍历单选框元素，判断哪个元素是选中的，将其值赋给 `selectedValue`。最后输出 `selectedValue` 即可。

相关问题

该如何拿到html中单选框value的值

在 HTML 中，单选框的值是通过 `value` 属性来设置的。要获取用户选择的单选框的值，可以使用 JavaScript 来获取该单选框的选中状态，并使用 `value` 属性获取其值。具体实现方法如下：

HTML 代码：

<label>
  <input type="radio" name="gender" value="male"> Male
</label>
<label>
  <input type="radio" name="gender" value="female"> Female
</label>
<button onclick="getRadioValue()">Get Value</button>

JavaScript 代码：

function getRadioValue() {
  // 获取所有 name 为 gender 的单选框
  var radios = document.getElementsByName("gender");

  // 遍历单选框，找到选中的单选框
  for (var i = 0; i < radios.length; i++) {
    if (radios[i].checked) {
      // 获取选中的单选框的值
      var value = radios[i].value;

      // 输出选中的单选框的值
      console.log(value);
      break;
    }
  }
}

在这个示例中，当用户点击按钮时，`getRadioValue()` 函数会获取所有名称为 `gender` 的单选框，并遍历它们以找到选中的单选框。一旦找到选中的单选框，函数就会使用 `value` 属性来获取其值，并输出到控制台中。

select选框改变option的值的时候,table里的数据动态改变

当 `select` 选框的值改变时，可以通过 JavaScript 监听 `change` 事件，并获取到当前 `select` 选框选中的值，然后根据这个值动态修改表格中对应的数据。

具体实现可以分为以下几个步骤：

1. 给 `select` 选框添加 `change` 事件监听：

   <select id="select-box" onchange="handleChange()">
     <option value="1">Option 1</option>
     <option value="2">Option 2</option>
     <option value="3">Option 3</option>
   </select>

2. 在 JavaScript 中定义 `handleChange` 函数，并获取当前选中的值：

   function handleChange() {
     const selectedValue = document.getElementById('select-box').value;
     // ...
   }

3. 根据选中的值修改表格中对应的数据：

   function handleChange() {
     const selectedValue = document.getElementById('select-box').value;
     const tableData = document.querySelectorAll('table td');
     
     tableData.forEach((td) => {
       if (td.textContent === selectedValue) {
         td.parentElement.style.display = 'table-row';
       } else {
         td.parentElement.style.display = 'none';
       }
     });
   }

这个例子中，我们根据当前选中的值，遍历表格中的每个 `td` 元素，如果它的文本内容和选中的值相同，就将它所在的行显示出来，否则隐藏。这样就可以根据 `select` 选框的选中值动态改变表格中的数据。