杨无敌+ 2022-03-01 08:51 采纳率: 83.3%
浏览 91
已结题

我选择“其他“”的时候,下面弹出一个input输入框,供用户输入

就是我选择其他的时候,下面弹出一个input输入框
            <label class="layui-form-label">访客单位</label>
            <div class="layui-input-inline">
                <select name="modules" lay-verify="required" lay-search="">
                    <option value="1">京东方</option>
                    <option value="2">英业达</option>
                    <option value="3">富士康</option>
                    <option value="4">其他</option>
                </select>
            </div>
        </div>
运行结果及报错内容
我的解答思路和尝试过的方法
我想要达到的结果
  • 写回答

4条回答 默认 最新

  • CSDN专家-showbo 2022-03-01 09:00
    关注

    添加select事件判断选中的值执行其他容器的显示隐藏,简单示例如下

    img

    <!DOCTYPE html>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
        <title>自定义模块 - layui</title>
    
        <link rel="stylesheet" href="../src/css/layui.css">
    
        <style>
        </style>
    </head>
    <body>
        <form class="layui-form" method="get">
            <div class="layui-form-item">
                <label class="layui-form-label">访客单位</label>
                <div class="layui-input-inline">
                    <select lay-filter="modules" name="modules" lay-verify="required" lay-search="">
                        <option value="1">京东方</option>
                        <option value="2">英业达</option>
                        <option value="3">富士康</option>
                        <option value="4">其他</option>
                    </select>
                </div>
                <div class="layui-input-inline" style="display:none" id="dvOther"><input type="text" id="txtOther" class="layui-input" placeholder="其他请输入" /></div>
            </div>
        </form>
    
        <script src="../src/layui.js"></script>
        <script>
            layui.use(['form'], function () {
                var form = layui.form, $ = layui.$;
                form.on('select(modules)', function (data) {
                    $('#dvOther')[data.value == '4' ? 'show' : 'hide']();
                });
    
                form.render("select");
            });
        </script>
    </body>
    </html>
    
    
    

    img

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论 编辑记录
查看更多回答(3条)

报告相同问题?

问题事件

  • 系统已结题 3月9日
  • 已采纳回答 3月1日
  • 创建了问题 3月1日

悬赏问题

  • ¥15 seatunnel 怎么配置Elasticsearch
  • ¥15 PSCAD安装问题 ERROR: Visual Studio 2013, 2015, 2017 or 2019 is not found in the system.
  • ¥15 (标签-MATLAB|关键词-多址)
  • ¥15 关于#MATLAB#的问题,如何解决?(相关搜索:信噪比,系统容量)
  • ¥500 52810做蓝牙接受端
  • ¥15 基于PLC的三轴机械手程序
  • ¥15 多址通信方式的抗噪声性能和系统容量对比
  • ¥15 winform的chart曲线生成时有凸起
  • ¥15 msix packaging tool打包问题
  • ¥15 finalshell节点的搭建代码和那个端口代码教程