昨天,同事遇到一个关于layui的问题,找不到正确的laypage的路径,加载出来的路径一直所在文件的工程路径为基础进行拼接。
具体代码示例如下:
在某一个1.html文档中采用Jquery的$(...).html()方法,并向其中加入另一个2.html文档,例子如下:
...
<div class="book-menu">
...
<div id="navBox3" linkpath="/main/monitor/monitor-law/list.html" class="book-cate-item text-ellipsis">监察法规</div>
</div>
<div class="book-list">
</div>
...
<script>
// 切换文章
$(".book-menu").on("click", ".book-cate-item", function () {
var linkpath = $(this).attr("linkpath");
$(".book-cate-item").removeClass("active");
$(this).addClass("active");
$.get(linkpath, function (html) {
$(".book-list").html(html);
})
})
</script>
假设此时1.html文件所在目录为main/monitor,如果再在2.html调用layui,执行以下方法时,
layui.use(['laypage', 'layer'], function() {...}
其laypage和layer的默认请求路径会加上1.html所在的文件夹路径,变为main/monito/layui/lay/modules/laypage.js、main/monito/layui/lay/modules/layer.js
最终解决办法为自定义layer的路径,即指定layer本来正确的路径,方法如下:
var rootPath ='/${data.websiteInfo.rootPath}' ;
layui.config({
dir: rootPath+'/public/layui/' //在此处配置自定义路径
, version: false
, debug: false
, base: ''
});