添加select事件判断选中的值执行其他容器的显示隐藏,简单示例如下
<!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>