怎么第一次下拉刷新拉不动

分类：MUI

<!DOCTYPE html>  
<html>  

    <head>  
        <meta charset="utf-8">  
        <title>Hello MUI</title>  
        <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">  
        <meta name="apple-mobile-web-app-capable" content="yes">  
        <meta name="apple-mobile-web-app-status-bar-style" content="black">  
        <link rel="stylesheet" href="http://ask.dcloud.net.cn/../css/encyclopedias.css" />  
        <link rel="stylesheet" href="http://ask.dcloud.net.cn/../css/mui.css">  
        <link rel="stylesheet" href="http://ask.dcloud.net.cn/../css/pullrefresh.css" />  
        <link rel="stylesheet" href="http://ask.dcloud.net.cn/../css/main.css" />  
        <script src="../js/mui.js"></script>  
        <script src="../js/app.js"></script>  
        <style>  
            html,  
            body {  
                background-color: #efeff4;  
            }  
        </style>  
    </head>  

    <body>  
        <!--下拉刷新容器-->  
        <div id="pullrefresh" class="mui-content mui-scroll-wrapper">  
            <div class="mui-scroll">  
                <!--数据列表-->  
                <ul class="mui-table-view mui-table-view-chevron">  

                </ul>  
            </div>  
        </div>  
        <script type="text/html" id="pull">  
        <a>  
        <div class="order-four">  
            <div class="order-four-left">  
                <img src="../images/yuantiao.jpg" class="order-four-left-img"/>  
            </div>  
            <div class="order-four-right">  
            <span style="color: #000000;font:'微软雅黑';font-size:20px ;">1000公里保养</span>  
            <span style="color: #FF0000;font:'微软雅黑';font-size:12px ;display: block;margin-top: 5px;">12323333</span>  
            <span style="color: #929292;font:'微软雅黑';font-size:12px ;display: block;margin-top: 5px;">电话号码：123456789</span>  
            <a>  
            <img src="../images/yuantiao.jpg" style="width: 15px;height:15px ;margin-top: 15px;"/>    
            <span style="font-size: 15px;color: #000000;">8</span>  
            <img src="../images/yuantiao.jpg" style="width: 15px;height:15px ;margin-top: 15px;margin-left:5px ;"/>   
            <span style="font-size: 15px;color: #000000;">8</span>  
            <img src="../images/yuantiao.jpg" style="width: 15px;height:15px ;margin-top: 15px;margin-left:5px ;"/>   
            <span style="font-size: 15px;color: #000000;">8</span>  
            </a>  
            </div>  
        </div>  
        </a>  
        </script>  
        <script>  
            mui.init({  
                swipeBack: false,  
                pullRefresh: {  
                    container: '#pullrefresh',  
                    down: {  
                        callback: pulldownRefresh  
                    },  
                    up: {  
                        contentrefresh: '正在加载...',  
                        callback: pullupRefresh  
                    }  
                }  
            });  
            /**  
             * 下拉刷新具体业务实现  
             */  
            function pulldownRefresh() {  
                setTimeout(function() {  
                    var table = document.body.querySelector('.mui-table-view');  
                    //var cells = document.body.querySelectorAll('.mui-table-view-cell');  
                    for (var i = 0, len = i + 3; i < len; i++) {  
                        var li = document.createElement('li');  
                        li.innerHTML = document.getElementById('pull').innerHTML;  
                        //下拉刷新，新纪录插到最前面；  
                        table.insertBefore(li, table.firstChild);  
                    }  
                    mui('#pullrefresh').pullRefresh().endPulldownToRefresh(); //refresh completed  
                }, 1000);  
            }  
            var count = 0;  
            /**  
             * 上拉加载具体业务实现  
             */  
            function pullupRefresh() {  
                setTimeout(function() {  
                    mui('#pullrefresh').pullRefresh().endPullupToRefresh((++count > 2)); //参数为true代表没有更多数据了。  
                    var table = document.body.querySelector('.mui-table-view');  
                    for (var i = 0, len = i + 20; i < len; i++) {  
                        var li = document.createElement('li');  
                        li.innerHTML = document.getElementById('pull').innerHTML;  
                        table.appendChild(li);  
                    }  
                }, 1000);  
            }  
            if (mui.os.plus) {  
                mui.plusReady(function() {  
                    setTimeout(function() {  
                        mui('#pullrefresh').pullRefresh().pullupLoading();  
                        }, 300);  

                });  
            } else {  
                mui.ready(function() {  
                    mui('#pullrefresh').pullRefresh().pullupLoading();  
                });  
            }  
      //给列表添加点击事件  
      mui('#pullrefresh').on('tap','a',function(e){  

      });  
      </script>  
    </body>  

</html>

2015-02-26 11:45 负责人:无分享