静候
静候
  • 发布:2016-10-30 11:33
  • 更新:2016-11-06 18:53
  • 阅读:1861

下拉刷新+ajax问题

分类:MUI

请问下我按照MUI文档说的试了下下拉刷新+AJAX,但是没有反应,是怎么回事呢,还请知道的各位大大指点下帮我看看问题出在哪里,谢谢啦!

<!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="../css/mui.min.css">  
    </head>  

    <body>  
        <div class="mui-content">  
            <!--下拉刷新容器-->  
        <div id="refreshContainer" class="mui-content mui-scroll-wrapper">  
          <div class="mui-scroll">  
            <!--数据列表-->  
            <div id="box_json">  
             <!-- <div class="mui-card">  
                    <div class="mui-card-header">页眉</div>  
                    <div class="mui-card-content">  
                        <div class="mui-card-content-inner">  
                            <p>Posted on January 18, 2016</p>  
                            <p style="color: #333;">这里显示文章摘要,让读者对文章内容有个粗略的概念...</p>  
                        </div>  
                    </div>  
                    <div class="mui-card-footer">  
                        <a class="mui-card-link">Like</a>  
                        <a class="mui-card-link">Read more</a>  
                    </div>  
                </div>-->  
            </div>  
        </div>  
    </div>  
</div>  
        <script src="../js/mui.min.js"></script>  
        <script type="text/javascript">    
            mui.init({  
              pullRefresh : {  
                container:"#refreshContainer",//下拉刷新容器标识,querySelector能定位的css选择器均可,比如:id、.class等  
                down:{  
                  height:50,   //可选,默认50.触发下拉刷新拖动距离,  
                  auto: true,  //可选,默认false.自动下拉刷新一次  
                  contentdown : "下拉可以刷新",  //可选,在下拉可刷新状态时,下拉刷新控件上显示的标题内容  
                  contentover : "释放立即刷新",  //可选,在释放可刷新状态时,下拉刷新控件上显示的标题内容  
                  contentrefresh : "正在刷新...",  //可选,正在刷新状态时,下拉刷新控件上显示的标题内容  
                  callback :pullfresh-function   //必选,刷新函数,根据具体业务来编写,比如通过ajax从服务器获取新数据;  
                }  
              }  
            });  
            function pullfresh-function() {  
             //业务逻辑代码,比如通过ajax从服务器获取新数据;  
            mui.ajax({  
                url: "../JSON/ceshi.json",  
                type: "get",  
                async: true,  
                dataType: "json",  
                success: function(data) {  
                    var data = data.article;  
                    var oBox = document.getElementById("box_json");  
                    var content = "";  
                    for(var i = 0 ; i < data.length; i++) {  
                        content += '<div class="mui-card">'+  
                        '<div class="mui-card-header">'+data[i].title+  
                        '</div>'+  
                        '<div class="mui-card-content">'+  
                            '<div class="mui-card-content-inner">'+  
                            '<p>'+data[i].date+'</p>'+  
                                '<p style="color: #333;">'+data[i].text+'</p>'+  
                            '</div>'+  
                        '</div>'+  
                        '<div class="mui-card-footer">'+  
                            '<a class="mui-card-link">Like</a>'+  
                            '<a class="mui-card-link">Read more</a>'+  
                        '</div>'+  
                    '</div>'                          
                    }  
                    oBox.innerHTML = content;  
                     mui('#refreshContainer').pullRefresh().endPulldownToRefresh();  
                },  
                error: function(xhr, type, errorThrown) {  
                    console.log(errorThrown);  
                }  
            });  
     //注意,加载完新数据后,必须执行如下代码,注意:若为ajax请求,则需将如下代码放置在处理完ajax响应数据之后      
}         
        </script>  
    </body>  

</html>
2016-10-30 11:33 负责人:无 分享
已邀请:
1***@qq.com

1***@qq.com

mui客服说:必须是双webview模式的。测试了一下 确实 。

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