layui可以动态添加div吗_layui添加动态菜单与选项卡

本文实例为大家分享了Android九宫格图片展示的具体代码&＃xff0c;供大家参考&＃xff0c;具体内容如下

HTML

index.js

layui.use(&＃39;element&＃39;, function() {

function checkLastItem(arr, i) {

return arr.length &＃61;&＃61; (i &＃43; 1);

}

function getAhtml(obj){

return "" &＃43; obj.name &＃43; "";

}

//动态菜单

layui.jquery.ajax({

url: "http://127.0.0.1:18000/sys/menus",

method: &＃39;POST&＃39;,

success: function(res) {

var html &＃61; "";

for(var i &＃61; 0; i

var strli &＃61; "

if (res[i].url &＃61;&＃61;&＃39;#&＃39;){

strli &＃61; strli &＃43; "" &＃43; res[i].name &＃43; "";

console.log(res[i].name)

}else{

strli &＃61; strli &＃43; getAhtml(res[i]);

}

if(res[i].pId &＃61;&＃61; "0" && !checkLastItem(res, i) && res[i &＃43; 1].pId !&＃61; "0") {

strli &＃61; strli &＃43; "

for(; !checkLastItem(res, i) && res[i &＃43; 1].pId !&＃61; "0"; i&＃43;&＃43;) {

strli &＃61; strli &＃43; "

}

strli &＃61; strli &＃43; "

}

strli &＃61; strli &＃43; "

html &＃61; html &＃43; strli;

}

layui.jquery("#memus").html(html);

layui.element.init(); //一定初始化一次

}

})

});

//添加选项卡

function addTab(name, url) {

if(layui.jquery(".layui-tab-title li[lay-id&＃61;&＃39;" &＃43; name &＃43; "&＃39;]").length > 0) {

//选项卡已经存在

layui.element.tabChange(&＃39;tabDemo&＃39;, name);

layer.msg(&＃39;切换-&＃39; &＃43; name)

} else {

//动态控制iframe高度

var tabheight &＃61; layui.jquery(window).height() - 95;

contentTxt &＃61; &＃39;&＃39;;

//新增一个Tab项

layui.element.tabAdd(&＃39;tabDemo&＃39;, {

title: name,

content: contentTxt,

id: name

})

//切换刷新

layui.element.tabChange(&＃39;tabDemo&＃39;, name)

layer.msg(&＃39;新增-&＃39; &＃43; name)

}

}

菜单JSON

[

{

"name": "首页",

"url": "shouye.html",

"id": "1",

"pId": "0"

},

{

"name": "数据库",

"url": "#",

"id": "1",

"pId": "0"

},

{

"name": "MYSQL",

"url": "mysql.html",

"id": "2",

"pId": "1"

},

{

"name": "ORACLE",

"url": "oracle.html",

"id": "3",

"pId": "1"

},

{

"name": "开发语言",

"url": "#",

"id": "4",

"pId": "0"

},

{

"name": "JAVA",

"url": "java.html",

"id": "5",

"pId": "4"

},

{

"name": "Python",

"url": "python.html",

"id": "6",

"pId": "4"

}

]

效果截图&＃xff1a;

以上就是本文的全部内容&＃xff0c;希望对大家的学习有所帮助&＃xff0c;也希望大家多多支持。