XBB
XBB
  • 发布:2015-04-16 17:51
  • 更新:2015-04-16 18:03
  • 阅读:2990

左右滑动动态加载数据的问题

分类:MUI
mui

JS代码

mui.init()  
             mui.plusReady(function() {  
                var menuName = new Array('推荐', '高分', '北京', '笑话', '资讯', '娱乐', '职场', '旅游', '艺术', '行业', '生活', '时尚', '公众号'); //栏目  
                var area = plus.storage.getItem('area');  
                if (area != null) {  
                    menuName[2] = area;  
                }  
                var menuId = new Array(0, 44, 0, 28, 15, 18, 12, 24, 14, 1, 34, 35, 0);  
                var mobileWidth = plus.screen.resolutionWidth //屏幕宽度  
                var num = 0;  
                var div = null;  
                var li = '',  
                    liWidth = '',  
                    before = '',  
                    after = '',  
                    active = '',  
                    red = '',  
                    id = '';  
                if (mobileWidth > 320) {  
                    num = 6;  
                    liWidth = 'mui-col-xs-2';  
                } else {  
                    num = 5;  
                    liWidth = 'm-5';  
                }  
                for (var i in menuName) {  
                    active = '';  
                    if (i == 0) {  
                        active = ' class="active"';  
                    }  
                    red = '';  
                    if (i == 1) {  
                        red = ' class="text-red"';  
                    }  
                    id = '';  
                    if (i == 2) {  
                        id = ' id="area"';  
                    }  
                    li += '<li class="mui-table-view-cell mui-media ' + liWidth + '"><a data="' + menuId[i] + '"' + active + id + '><span' + red + '>' + menuName[i] + '</span></a></li>';  
                    if ((Number(i) + 1) % num == 0 || (Number(i) + 1) == menuName.length) {  
                        div = document.createElement("div");  
                        div.className = 'mui-slider-item';  
                        div.innerHTML = '<ul class="mui-table-view mui-grid-view">' + li + '</ul>';  
                        document.getElementById("MenuList").appendChild(div);  
                        if ((Number(i) + 1) == num) {  
                            before = document.createElement("div");  
                            before.className = 'mui-slider-item mui-slider-item-duplicate';  
                            before.innerHTML = '<ul class="mui-table-view mui-grid-view">' + li + '</ul>';  
                        }  
                        if ((Number(i) + 1) == menuName.length) {  
                            after = document.createElement("div");  
                            after.className = 'mui-slider-item mui-slider-item-duplicate';  
                            after.innerHTML = '<ul class="mui-table-view mui-grid-view">' + li + '</ul>';  
                            document.getElementById("MenuList").appendChild(before);  
                            document.getElementById("MenuList").insertBefore(after, document.getElementById("MenuList").firstChild);  
                        }  
                        li = '';  
                    }  
                }  
                main = plus.webview.currentWebview();  
                menu = mui.preload({  
                    id: 'usermenu',  
                    url: 'usermenu.html',  
                    styles: {  
                        left: "30%",  
                        width: '70%',  
                        zindex: 9997  
                    }  
                });  
            });

html代码

<div class="mui-content">  
            <div class="mui-slider" id="Menu">  
                <div class="mui-slider-group mui-slider-loop" id="MenuList">  

                </div>  
            </div>  

        </div>

有时候打开是正常的从第一页开始显示

但有时候打开是从最后一页开始显示

2015-04-16 17:51 负责人:无 分享
已邀请:
DCloud_UNI_FXY

DCloud_UNI_FXY

把下边这个区域也动态生成。生成后,手动调用一下mui('#Menu').slider();

<div class="mui-slider" id="Menu">  
                <div class="mui-slider-group mui-slider-loop" id="MenuList">  

                </div>  
            </div>

该问题目前已经被锁定, 无法添加新回复