菜单栏为什么拼出来是这样,没有地方问了求大佬指点一下?非常感谢

言午琅 发布于 2018/10/23 22:01
阅读 115
收藏 0

这是js的代码 var menu=result.menuXm;//获取result里的一个对象,有在浏览器的调试器调试过是先输出库存总汇,但我不是设置了.cj的添加子节点,第一次弄,百度也百度不到,想要了 求大佬 指点一下怎么搞 大晚上的不容易啊

var menu=result.menuXm;//获取result里的一个对象
var html="";//标签用于接收拼接的
 for (var i = 0; i <= menu.length; i++) {
     //循环接收的对象里 的属性
    if(menu[i].pid=="") {//判断父节点
            alert(menu[i].caidan);
            html += " <li class=\"layui-nav-item layui-nav-itemed\">";
            html += "  <a class=\"\" href=\"javascript:;\">" + menu[i].caidan + "</a>";
            html += "<dl class=\"layui-nav-child cj\" >";
            html +="</dl>"
            html +="</li>";
            html +="</ui>";
        }
    else if(menu[i].pid==1||menu.pid==5){//判断子节点
        alert(menu[i].pid+"和"+menu[i].idM)

        alert(menu[i].caidan);
            html += "<dd><a href=\"javascript:;\">" + menu[i].caidan + "</a></dd>";
            $(".cj").append(html)
    }
     $("#cs").html(html);
    }
加载中
0
爱蔚兰真好
没能理解你表述的问题
言午琅
就是拼接出来的菜单html的样式走形了,蓝色的字应该要点击白色的才可以出来,而且库存汇总怎么跑到上面去了我设了添加子节点的,应该在出库单的下面,实在不知道怎么去拼接,网上找不到可以参考的案例,layui的,但可能是我水平太渣了
0
q
qwer112312

明显是没有引入样式。。。。

0
张攀
张攀

错误点挺多的,主要是自己逻辑不清晰和粗心。

1. 你是要拼接数据,那么最后的

$("#cs").html(html);

肯定要在for 循环的外面,你这样做也可以做到,但是无谓的做了很多次渲染。

2. 你的子节点必须要关联父节点的,你的代码中有两级,那么子级的父节点必须等于父级的节点,那么才能关联起来做成菜单。从你的代码中,知道你的数据是父子级在同一维度数组中,所以两级至少要两个嵌套循环才能做出来。

3. 遍历时,要 i<menu.length,不然数组会越界,代码中$("#cs")已经是 ul 标签了,因此不需要 ul 结束标签,ul结束标签直接写在页面中即可。

for (var i = 0; i <= menu.length; i++) { // 这里数组的长度遍历有问题,会越界

html +="</ui>"; //这里粗心写错了。

综上:

var menu=result.menuXm;//获取result里的一个对象
var html="";//标签用于接收拼接的
for (var i = 0; i < menu.length; i++) {
     //循环接收的对象里 的属性
    if(menu[i].pid=="") {//判断父节点
            html += ' <li class="layui-nav-item layui-nav-itemed">';
            html += '  <a class="" href="javascript:;">' + menu[i].caidan + '</a>';
            html += '<dl class="layui-nav-child cj" >';
             // 遍历全部数据找到这个节点的子节点
            for(var j = 0; i < menu.length; j++) {
                if(menu[j].pid == menu[i].idM)  {
                   html += '<dd><a href="javascript:;">' + menu[j].caidan + '</a></dd>';  
                }    
            }
            html +='</dl>'
            html +='</li>';       
     }
}   
$("#cs").html(html);

这里假设了你的每个节点的关联id 是 idM,另外 js 中拼接时单引号和双引号结合使用就不需要转义了,我习惯使用单引号,如果html 中属性使用双引号。实际使用可能要稍微进行要修改,

OSCHINA
登录后可查看更多优质内容
返回顶部
顶部