解決Layui當(dāng)中的導(dǎo)航條動(dòng)態(tài)添加后渲染失敗的問(wèn)題
更新時(shí)間：2019年09月25日 15:16:35 作者：饅頭君一號(hào)
今天小編就為大家分享一篇解決Layui當(dāng)中的導(dǎo)航條動(dòng)態(tài)添加后渲染失敗的問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
今天在使用Layui導(dǎo)航條動(dòng)態(tài)添加的時(shí)候，發(fā)現(xiàn)動(dòng)態(tài)添加后沒(méi)有辦法再次渲染他的效果，原因未知，但是已經(jīng)解決了，這里利用的方式是將它渲染出來(lái)的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在頁(yè)面加載時(shí)渲染出來(lái)的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);
})
}
這樣就解決了問(wèn)題！
以上這篇解決Layui當(dāng)中的導(dǎo)航條動(dòng)態(tài)添加后渲染失敗的問(wèn)題就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript實(shí)現(xiàn)的經(jīng)典文件樹(shù)菜單效果
這篇文章主要介紹了JavaScript實(shí)現(xiàn)的經(jīng)典文件樹(shù)菜單效果,通過(guò)JavaScript結(jié)合json數(shù)組實(shí)現(xiàn)文件樹(shù)菜單的效果,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下2015-09-09
微信小程序?qū)崿F(xiàn)簡(jiǎn)單的吸頂效果
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)簡(jiǎn)單的吸頂效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-05-05
告訴你一個(gè)排序算法，也許是最重要的是他們知道 - 快速排序，無(wú)論是在PHP和JavaScript實(shí)現(xiàn)的。雖然這兩種語(yǔ)言之間的代碼看起來(lái)相似，也有一些差異，這表明了語(yǔ)法知識(shí)的重要性！2011-02-02
這篇文章主要介紹了微信小程序3種位置API的使用方法詳解,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-08-08
也許你有一個(gè)很酷的主頁(yè)，很希望與人分享。同時(shí)，你希望訪問(wèn)你主頁(yè)的人能對(duì)你的主頁(yè)提供一些意見(jiàn)和建議，或者你對(duì)某個(gè)主題感興趣，而希望客人也許能給你一幫助，這就要用到留言簿。留言簿使得你能與每一個(gè)訪問(wèn)你主頁(yè)的人交換信息。2008-09-09
在DOM里面操作textarea里面的字符，是比較麻煩的,本文將介紹一種比較簡(jiǎn)單的方法，需要的朋友可以參考下
2012-12-12 
Javascript中獲取對(duì)象的原型對(duì)象的方法小結(jié)
這篇文章主要介紹了Javascript中獲取對(duì)象的原型對(duì)象的方法小結(jié),需要的朋友可以參考下
2015-02-02 
如果對(duì)javascript了解不是特別深入的話,很容易就會(huì)寫(xiě)出不兼容的代碼(就像我),這時(shí)候就得判斷瀏覽器了。比如事件偵聽(tīng)、一些鼠標(biāo)和鍵盤(pán)事件、Range等,一些都會(huì)不一樣.下面列出幾種常用的檢測(cè)瀏覽器方法，以饗觀眾!
2009-09-09 
JavaScript鼠標(biāo)拖動(dòng)事件監(jiān)聽(tīng)使用方法以及實(shí)例效果演示
最近工作中遇到了鼠標(biāo)拖動(dòng)事件監(jiān)聽(tīng)的相關(guān)需求,所以下面這篇文章主要給大家介紹了關(guān)于JavaScript鼠標(biāo)拖動(dòng)事件監(jiān)聽(tīng)使用方法以及實(shí)例效果演示的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下
2023-05-05