layui单选按钮不同按钮显示输入框不同

你可以使用 layui 的表单组件和事件监听来实现这个功能。具体步骤如下：

1. 在 HTML 中添加单选按钮和输入框：

<form class="layui-form" action="">
  <div class="layui-form-item">
    <label class="layui-form-label">选项</label>
    <div class="layui-input-block">
      <input type="radio" name="option" value="1" title="选项1">
      <input type="radio" name="option" value="2" title="选项2">
      <input type="radio" name="option" value="3" title="选项3">
    </div>
  </div>
  <div class="layui-form-item" id="input1" style="display:none;">
    <label class="layui-form-label">输入框1</label>
    <div class="layui-input-block">
      <input type="text" name="input1" placeholder="请输入输入框1" autocomplete="off" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item" id="input2" style="display:none;">
    <label class="layui-form-label">输入框2</label>
    <div class="layui-input-block">
      <input type="text" name="input2" placeholder="请输入输入框2" autocomplete="off" class="layui-input">
    </div>
  </div>
  <div class="layui-form-item" id="input3" style="display:none;">
    <label class="layui-form-label">输入框3</label>
    <div class="layui-input-block">
      <input type="text" name="input3" placeholder="请输入输入框3" autocomplete="off" class="layui-input">
    </div>
  </div>
</form>

2. 在 JavaScript 中监听单选按钮的变化，根据选中的按钮显示对应的输入框：

// layui表单组件
var form = layui.form;

// 监听单选按钮的变化
form.on('radio(option)', function(data){
  // 隐藏所有输入框
  $('#input1').hide();
  $('#input2').hide();
  $('#input3').hide();
  // 根据选中的按钮显示对应的输入框
  if (data.value == '1') {
    $('#input1').show();
  } else if (data.value == '2') {
    $('#input2').show();
  } else if (data.value == '3') {
    $('#input3').show();
  }
});

3. 最后记得引入 layui 的相关文件：

<link rel="stylesheet" href="https://cdn.staticfile.org/layui/2.5.6/css/layui.min.css">
<script src="https://cdn.staticfile.org/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/layui/2.5.6/layui.min.js"></script>