“layui is not defined”表明Layui未加载成功,主因是layui.js未正确引入:检查路径是否准确、是否被Shiro等拦截、是否放在静态资源目录、CDN是否过期;确保其在jQuery之后、自定义脚本之前引入且不重复;模块使用必须在layui.use()回调中。

“layui is not defined”不是单选框、分页或 layer 的专属问题,而是整个 Layui 环境根本没加载成功。只要看到这个报错,后续所有模块(form、laypage、layer、table)都不可用——你只是恰好在单选框这一步撞上了。
检查 layui.js 是否被正确加载(90% 场景根因)
浏览器 Network 面板里,layui.js 必须返回状态码 200,不能是 404、403 或被拦截。常见干扰点:
- 路径手敲出错:比如写成
./static/layui/layui.js,但实际在/js/layui/layui.js;用 IDE 右键“复制路径”更可靠 - Spring Boot + Shiro 项目中,
shiroFilter默认拦截/static/layui/**,需在ShiroConfig中显式放行静态资源 - 文件放在了被 MVC 拦截的目录(如
/templates/或/views/),应确保layui.js在可直接访问的静态目录(如/static/js/layui/) - CDN 地址过期:旧版 CDN(如
https://cdn.staticfile.org/layui/2.6.8/layui.js)可能不兼容新模块,建议用官网最新地址或下载离线包
layui.js 的 <script></script> 标签位置是否合规
layui.js 必须满足两个硬性顺序:
- 必须在
jquery.js(1.8+)之后引入(Layui 内部依赖 jQuery) - 必须在你自己的初始化脚本(如含
layui.use()的 JS)之前引入——哪怕只差一行,也会报错 - 不能重复引入:同一个页面只允许一个
<script src="layui.js"></script>
错误示例:<script src="my-init.js"></script> 放在 layui.js 前面,或和它并列在 末尾。
确认是否在 layui.use() 回调里使用模块
即使 layui 对象存在,模块(如 form、laypage、layer)也未必就绪。Layui 是按需加载,所有模块调用必须包裹在 layui.use() 回调中:
- 错:
layui.form.render('radio');→ 报Cannot read property 'render' of undefined - 对:
layui.use('form', function(){ var form = layui.form; form.render('radio'); }); - 多个模块一起用:
layui.use(['form', 'layer', 'laypage'], function(){ ... }); - 注意字符串参数:写
'form',不是form(没引号是变量,会报错)
HTML 结构是否满足模块渲染前提(容易被忽略的叠加错误)
模块加载成功 ≠ 控件自动生效。比如单选框不显示样式,常因 DOM 结构不达标:
-
是必须的容器 class,form.render()只扫描该 class 下的元素 - 单选框本身要带
name属性(用于分组),且推荐配或title,否则渲染后文字可能丢失 - 别在
layui.use()外部直接绑定事件,如document.getElementById().onclick;应统一用form.on('radio(filter)', callback)
真正麻烦的是错误叠加:改完路径发现还是不渲染,结果是漏了 class="layui-form";或者加了 class 又忘了 layui.use 包裹。建议每次只动一个点,用 Console 和 Network 交叉验证。











