基于单选框的隐藏/显示自身

以下是一个基于单选框的隐藏/显示自身的解决方法的代码示例：

HTML代码：

<input type="radio" name="toggle" id="toggle1" onclick="toggleVisibility('toggle1')"> 显示/隐藏
<div id="content1" style="display:none">这是隐藏的内容</div>

<input type="radio" name="toggle" id="toggle2" onclick="toggleVisibility('toggle2')"> 显示/隐藏
<div id="content2" style="display:none">这是隐藏的内容</div>

JavaScript代码：

function toggleVisibility(elementId) {
  var element = document.getElementById(elementId);
  if (element.style.display === "none") {
    element.style.display = "block";
  } else {
    element.style.display = "none";
  }
}

这段代码中，我们使用了两个单选框来控制两个不同的内容区域的显示和隐藏。每个单选框都有一个唯一的ID，并且在点击时调用toggleVisibility函数来切换对应内容区域的显示状态。

在toggleVisibility函数中，我们首先通过传入的参数elementId获取到对应的元素。然后，我们检查该元素的display属性值，如果是"none"，则将其改为"block"，使其显示出来；如果不是"none"，则将其改为"none"，使其隐藏起来。

通过这种方式，我们可以根据单选框的选择来动态控制对应内容区域的显示和隐藏。