'use strict';
layui.config({
version: true //一般用于更新模块缓存,默认不开启。设为true即让浏览器不缓存。也可以设为一个固定的值,如:201610
, debug: false //用于开启调试模式,默认false,如果设为true,则JS模块的节点会保留在页面
, base: 'app/', //设定扩展的Layui模块的所在目录,一般用于外部模块扩展
}).use(['element', 'layer'], function () {
var element = layui.element,
$ = layui.jquery,
layer = layui.layer;
layer.msg('app.js');
console.log(element)
element.on('nav(top_nav)', function(elem){
console.log(elem)
console.log(elem.find(".menu").attr('data-href'))
// 菜单跳转
var href = elem.find('.menu').attr('data-href');
layer.msg(elem.text());
if(!elem.find('.menu').attr('target')){
$.get(href, function(data){
$('#left').html('').append(data);
element.init();
});
} else {
$('#left').html('');
}
});
if ($("#menu .menu").attr('data-href')){
$("#menu .menu:first").click();
}
element.on('nav(left_nav)', function(elem){
console.log('left_nav',elem)
console.log('left_nav',elem.find("a").attr('data-href'))
//layer.msg("加载中...",{icon: 16,shade: [0.01, '#f5f5f5'],scrollbar: false,offset: '0px', time:100000});
layer.load(0, {time: 500});
// 菜单跳转
var href = elem.find('a').attr('data-href');
// 新增tab 标签信息
var title = "<li class=\"layui-this\">"
+"<i class=\"fa fa-dashboard\" aria-hidden=\"true\"></i>"
+"<cite>"+elem.text()+"</cite>"
+"<i class=\"layui-icon layui-unselect layui-tab-close\" data-id=\"1\">ဆ</i>"
+"</li>";
var content = "<div class=\"\">"
+"<iframe src=\""+href+"\" style=\"overflow:visible;\" scrolling=\"yes\" frameborder=\"no\" width=\"100%\" height=\"650\"></iframe>"
+"</div>";
// $('.ca-tab-content div').hide();
// $('.ca-tab-title').append(title);
// $('.ca-tab-content').append(content);
$('#mainFrame').attr("src",href);
});
}); //加载入口
/*layui.define(function(exports){
//do something
console.log('come in layui.define');
exports('demo', function(){
console.log('Hello World!');
});
});*/
/* layui.use('./app/index', func
layui基本使用 -后台管理
最新推荐文章于 2023-03-24 22:27:18 发布
本文介绍了layui框架在后台管理中的基本使用方法,包括HTML结构和左侧菜单的搭建,为构建高效简洁的后台界面提供指导。
摘要由CSDN通过智能技术生成