解決Layui當(dāng)中的導(dǎo)航條動態(tài)添加后渲染失敗的問題
更新時間：2019年09月25日 15:16:35 作者：饅頭君一號
今天小編就為大家分享一篇解決Layui當(dāng)中的導(dǎo)航條動態(tài)添加后渲染失敗的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
今天在使用Layui導(dǎo)航條動態(tài)添加的時候，發(fā)現(xiàn)動態(tài)添加后沒有辦法再次渲染他的效果，原因未知，但是已經(jīng)解決了，這里利用的方式是將它渲染出來的span.layui-nav-bar樣式利用DOM先刪除掉再重新渲染，直接貼圖看結(jié)果
<ul class="layui-nav" id="nav" layui-filter="test"></ul>
js代碼
$(function () {
$.ajax({
url: '/Main/GetType1',
success: function (da) {
//重點(diǎn)地方，將Layui在頁面加載時渲染出來的span.layui-nav-bar提前刪除掉
$("#nav").find('span.layui-nav-bar').remove();
$.each(da, function (index, value) {
var name = da[index]['name'];
var id=da[index]['id'];
var $li = $("<li class='layui-nav-item' id='t"+id+"'><a href='javascript:;'>" + name + "</a></li>");
$("#nav").append($li);
//addul("t" + id, id);
})
//列表添加完后再次執(zhí)行渲染
xuanran();
}
})
})
function xuanran() {
layui.use('element', function () {
var element = layui.element;
var layFilter = $("#nav").attr('lay-filter');
element.render('nav', layFilter);
})
}
這樣就解決了問題！
以上這篇解決Layui當(dāng)中的導(dǎo)航條動態(tài)添加后渲染失敗的問題就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript出現(xiàn)setTimeout倒計時誤差的原因分析
setTimeout?倒計時誤差的出現(xiàn)主要與?JavaScript?的事件循環(huán)機(jī)制和計時器的執(zhí)行方式有關(guān)，本文就來和大家講講具體出現(xiàn)的原因以及解決方法，需要的可以參考一下2023-06-06
這篇文章主要為大家詳細(xì)介紹了JS控制TreeView的結(jié)點(diǎn)選擇,具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-11-11
使用JavaScript實現(xiàn)alert的實例代碼
本文通過實例代碼給大家介紹了js實現(xiàn)alert的方法，代碼簡單易懂，非常不錯，具有參考借鑒價值，需要的的朋友參考下吧2017-07-07
本文通過實例代碼給大家介紹了js同時按下兩個方向鍵的實現(xiàn)方法，感興趣的朋友跟隨腳本之家小編一起看看吧2007-12-12
JS獲取計算機(jī)mac地址以及IP的實現(xiàn)方法
本篇文章主要是對利用JS獲取計算機(jī)mac地址以及IP的實現(xiàn)方法進(jìn)行了介紹，需要的朋友可以過來參考下，希望對大家有所幫助2014-01-01
在java中有private屬性，強(qiáng)大的功能js不能實現(xiàn)就矮人一截，匿名函數(shù)，發(fā)揚(yáng)廣大2010-09-09
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)簡易的計算器功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-09-09
這篇文章主要介紹了JS+DIV實現(xiàn)的卷簾效果,結(jié)合具體實例形式對比分析了javascript響應(yīng)鼠標(biāo)事件動態(tài)操作頁面元素屬性實現(xiàn)展開與折疊效果的相關(guān)操作技巧,需要的朋友可以參考下2017-03-03
給應(yīng)用部分的js代碼設(shè)定一個統(tǒng)一的入口
javascript是種腳本語言，瀏覽器下載到哪兒就會執(zhí)行到哪兒，下面為大家介紹下，如何給應(yīng)用部分的js代碼一個統(tǒng)一的入口2014-06-06
基于JavaScript實現(xiàn)熔巖燈效果導(dǎo)航菜單
這篇文章主要介紹了基于JavaScript實現(xiàn)熔巖燈效果導(dǎo)航菜單，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-01-01