如何使用输入单选按钮显示输入文本？

使用输入单选按钮显示输入文本的方法是通过HTML和JavaScript来实现。

首先，在HTML中创建一个单选按钮组，可以使用<input>标签的type属性设置为radio，并为每个单选按钮设置相同的name属性，但不同的value属性。例如：

<input type="radio" name="option" value="option1">选项1
<input type="radio" name="option" value="option2">选项2
<input type="radio" name="option" value="option3">选项3

接下来，在HTML中创建一个用于显示文本的元素，例如一个<div>标签：

<div id="result"></div>

然后，使用JavaScript来监听单选按钮的选择事件，并将选择的文本显示在<div>元素中。可以通过addEventListener方法来为每个单选按钮添加事件监听器，当选择发生变化时，触发相应的函数。在函数中，可以使用document.getElementById方法获取选中的单选按钮的值，并将其设置为<div>元素的内容。例如：

<script>
  const option1 = document.getElementById('option1');
  const option2 = document.getElementById('option2');
  const option3 = document.getElementById('option3');
  const result = document.getElementById('result');

  option1.addEventListener('change', function() {
    if (option1.checked) {
      result.textContent = option1.value;
    }
  });

  option2.addEventListener('change', function() {
    if (option2.checked) {
      result.textContent = option2.value;
    }
  });

  option3.addEventListener('change', function() {
    if (option3.checked) {
      result.textContent = option3.value;
    }
  });
</script>

以上代码中，option1、option2和option3分别代表三个单选按钮的元素，result代表用于显示文本的<div>元素。通过addEventListener方法为每个单选按钮添加change事件监听器，当选择发生变化时，触发相应的函数。在函数中，使用checked属性判断单选按钮是否被选中，如果选中，则将其值设置为<div>元素的内容。

这样，当用户选择不同的单选按钮时，相应的文本将显示在页面上。

腾讯云相关产品和产品介绍链接地址：