zoukankan      html  css  js  c++  java
  • APICloud 上滑加载更多

    <!DOCTYPE html>
    <html>   
        <head>
            <meta charset="UTF-8">
            <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"
            />
            <title>
                列表
            </title>
            <script src="../../script/jquery-1.11.1.min.js">
            </script>
            <script type="text/javascript" src="../../script/api.js">
            </script>
        </head>
        
        <body>
            <div style="100%">
                <ul id="list_item">
                </ul>
            </div>       
        </body>
        <script>
            apiready = function() {
                var id = 0;
                var cellarray = new Array();
                //得到json的路径
                var href = window.location.href; // 得到当前文件的路径
                var Route = ""; //得到json的路径                
                var json = ""; //读取的json
                var arr = new Array();
                arr = href.split("/");
                for (var i = 0; i < arr.length - 1; i++) {
                    Route += arr[i] + '/';
                }
                Route += "list.json";
                //读取json的文件  
                api.readFile({
                    path: Route
                },
                function(ret, err) {
                    if (ret.status) {
                        json = ret.data;
                        //Json(json);
                        var list = eval('(' + json + ')');
                        var json1 = eval(list.data);
                        for (var i = 0; i < json1.length; i++) {
                            cellarray[i] = json1[i].img;
                        }
                        //当json的值大于10的时候
                        if (cellarray.length >= 10) {
                            //循环添加前10 个li标签                        
                            id= Ergodic(id ,id * 10 + 10,cellarray);
                        } else {
                            //小于10则直接添加                       
                            id= Ergodic(id ,cellarray.length,cellarray);                        
                        }
                    } else {
                        api.alert({
                            msg: '错误码: ' + err.code + '错误信息' + err.msg
                        });
                    }
                });
                //判断是否滑到底
                api.addEventListener({
                    name: 'scrolltobottom'
                },
                function(ret, err) {
                    if (cellarray.length - id * 10 >= 10) {
                        //循环添加前10 个li标签                 
                        id= Ergodic(id , id * 10 + 10,cellarray);
                    } else {
                        if (cellarray.length - id * 10 < 10 && cellarray.length - id * 10 > 0) {
                            //小于10则直接添加                    
                            id= Ergodic(id , cellarray.length,cellarray);
                        } else {
                            api.toast({
                                msg: '已加载完毕',
                                duration: 1000,
                                location: 'bottom'
                            });
                        }
                    }
                })
            }
            function tuandetail()
            {
                    api.openWin({
                        name : 'tuandetail_header',
                        url : '../tuandetail_header.html',
                        bounces : false,
                        delay : 200
                    });
            }
            //遍历cellarray返回id
            function Ergodic(id ,sty,cellarray)
            {
                var html = "";
                for (var i = id * 10; i < sty; i++) {
                       html += "<li  onclick='tuandetail()'>><img src='" + cellarray[i] + "'/></li> ";                               
                 }
                 $("#list_item").append(html);
                 id += 1;
                 return id;
            }
            
        </script>
     

    </html>

  • 相关阅读:
    F#新Bug,小心! module 里的泛型变量。
    F#: mutable 关键字不适宜用于结构中声明可变值
    简说F#的数组
    元组——秃瓢(Tuple)
    如何用Xmind编写测试用例
    如何提高评审的效率
    接口测试实例/20200622
    mysql数据库的基本增删改查操作总结
    面试技巧篇02:面试前必看!
    面试技巧篇01
  • 原文地址:https://www.cnblogs.com/sg1991/p/4535999.html
Copyright © 2011-2022 走看看