资讯

精准传达 • 有效沟通

从品牌网站建设到网络营销策划,从策略到执行的一站式服务

解决Layui当中的导航条动态添加后渲染失败的问题

今天在使用Layui导航条动态添加的时候,发现动态添加后没有办法再次渲染他的效果,原因未知,但是已经解决了,这里利用的方式是将它渲染出来的span.layui-nav-bar样式利用DOM先删除掉再重新渲染,直接贴图看结果

成都创新互联提供网站建设、网站制作、网页设计,品牌网站设计广告投放等致力于企业网站建设与公司网站制作,十多年的网站开发和建站经验,助力企业信息化建设,成功案例突破成百上千,是您实现网站建设的好选择.

js代码

$(function () {
      $.ajax({
        url: '/Main/GetType1',
        success: function (da) {
          //重点地方,将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 = $("
  • " + name + "
  • "); $("#nav").append($li); //addul("t" + id, id); }) //列表添加完后再次执行渲染 xuanran(); } }) }) function xuanran() { layui.use('element', function () { var element = layui.element; var layFilter = $("#nav").attr('lay-filter'); element.render('nav', layFilter); }) }

    这样就解决了问题!

    以上这篇解决Layui当中的导航条动态添加后渲染失败的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持创新互联。


    网站名称:解决Layui当中的导航条动态添加后渲染失败的问题
    地址分享:http://cdkjz.cn/article/ghseds.html
    多年建站经验

    多一份参考,总有益处

    联系快上网,免费获得专属《策划方案》及报价

    咨询相关问题或预约面谈,可以通过以下方式与我们联系

    大客户专线   成都:13518219792   座机:028-86922220