1 { 2   "List": [ 3     { 4       "Id": 9, 5       "OrderCode": "1070010106490008", 6       "PhoneModel": "三星 盖乐世s6 白色", 7       "UserName": "张三", 8       "Status": 3, 9       "Message": null,10       "CreatedDate": "2016-09-29 15:23"11     },12     {13       "Id": 8,14       "OrderCode": "1070010106490007",15       "PhoneModel": "三星 盖乐世s6 白色",16       "UserName": "张三",17       "Status": 2,18       "Message": null,19       "CreatedDate": "2016-09-29 15:23"20     }21   ],22   "TotalRecords": 423 }

  1 mui.init();  2 (function($) {  3     //阻尼系数  4     var deceleration = mui.os.ios ? 0.003 : 0.0009;  5     $(‘.mui-scroll-wrapper‘).scroll({  6         bounce: false,  7         indicators: true, //是否显示滚动条  8         deceleration: deceleration  9     }); 10     $.ready(function() { 11         //循环初始化所有下拉刷新，上拉加载。 12         $.each(document.querySelectorAll(‘.mui-slider-group .mui-scroll‘), 13             function(index, pullRefreshEl) { 14                 $(pullRefreshEl).pullToRefresh({ 15                     down: { 16                         callback: function() { 17                             var self = this; 18                             setTimeout(function() { 19                                 try { 20                                     var ul = self.element.querySelector(‘.mui-table-view‘); 21                                     var ul_id = ul.id; 22  23                                     var arr = ul_id.split("-"); 24                                     var obj = list_item[arr[1]]; 25  26                                     jQuery("#" + obj.id).empty(); 27                                     load_items(obj); 28                                 } catch(e) { 29  30                                 } finally { 31                                     self.endPullDownToRefresh(); 32                                 } 33                             }, 1000); 34                         } 35                     }, 36                     up: { 37                         callback: function() { 38                             var self = this; 39                             setTimeout(function() { 40                                 try { 41                                     var ul = self.element.querySelector(‘.mui-table-view‘); 42                                     var ul_id = ul.id; 43  44                                     var arr = ul_id.split("-"); 45                                     var obj = list_item[arr[1]]; 46                                     var pageIndex = parseInt(obj.pageIndex) + 1; 47                                     obj.pageIndex = pageIndex; 48  49                                     load_items(obj); 50                                 } catch(e) { 51  52                                 } finally { 53                                     self.endPullUpToRefresh(); 54                                 } 55                             }, 1000); 56  57                         } 58                     } 59                 }); 60             }); 61         var createFragment = function(ul, index, count, reverse) { 62             var length = ul.querySelectorAll(‘li‘).length; 63             var fragment = document.createDocumentFragment(); 64             var li; 65             for(var i = 0; i < count; i++) { 66                 li = document.createElement(‘li‘); 67                 li.className = ‘mui-table-view-cell‘; 68                 li.innerHTML = ‘第‘ + (index + 1) + ‘个选项卡子项-‘ + (length + (reverse ? (count - i) : (i + 1))); 69                 fragment.appendChild(li); 70             } 71             return fragment; 72         }; 73     }); 74 })(mui); 75  76 var list_item = [{ 77     id: "shz", 78     status: 0, 79     statusName: "审核中", 80     pageIndex: 1, 81     pageSize: 10 82 }, { 83     id: "ywc", 84     status: 1, 85     statusName: "已完成", 86     pageIndex: 1, 87     pageSize: 10 88 }, { 89     id: "shsb", 90     status: 2, 91     statusName: "审核失败", 92     pageIndex: 1, 93     pageSize: 10 94 }]; 95  96 $(function() { 97     for(var i in list_item) { 98         load_items(list_item[i]); 99     }100 });101 102 function load_items(obj) {103     ax.g("api/order/getOrderList", {104             status: obj.status,105             pageIndex: obj.pageIndex,106             pageSize: obj.pageSize107         },108         function(d) {109             var list = d.List;110             for(var i in list) {111                 var item = list[i];112                 var id = item.Id;113                 var status = obj.status;114                 var strVar = "";115                 strVar += "<li class=\"listli\">";116                 strVar += "<ul class=\"mui-table-view\" id=\"order_card" + "-" + status + "-" + id + "\">";117                 strVar += "    <span class=\"mui-icon mui-icon-arrowright r-topicon2\"><\/span>";118                 strVar += "    <li class=\"mui-table-view-cell order_main\">";119                 strVar += "    <img src=http://www.mamicode.com/"img/order-img.png\" style=\"width: 14px;position: absolute;left: 0;\"/>";120                 strVar += "    <a class=\"co000\">";121                 strVar += "    <span class=\"co000\">" + item.UserName + "<\/span>";122                 strVar += "    <span class=\"mui-pull-right co000\">" + obj.statusName + "<\/span>";123                 strVar += "    <\/a>";124                 strVar += "    <\/li>";125                 strVar += "    <li class=\"mui-table-view-cell\">";126                 strVar += "    <a class=\"co888\">";127                 strVar += "                        订单编号";128                 strVar += "    <span class=\"mui-pull-right co000\">" + item.OrderCode + "<\/span>";129                 strVar += "    <\/a>";130                 strVar += "    <\/li>";131                 strVar += "    <li class=\"mui-table-view-cell\">";132                 strVar += "    <a class=\"co888\">";133                 strVar += "                        商品名称";134                 strVar += "    <span class=\"mui-pull-right co000\">" + item.PhoneModel + "<\/span>";135                 strVar += "    <\/a>";136                 strVar += "    <\/li>";137                 strVar += "    <li class=\"mui-table-view-cell\">";138                 strVar += "    <a class=\"co888\">";139                 strVar += "创建时间";140                 strVar += "    <span class=\"mui-pull-right co000\">" + new Date(item.CreatedDate).Format("yyyy-MM-dd hh:mm") + "<\/span>";141                 strVar += "    <\/a>";142                 strVar += "    <\/li>";143                 if(obj.status == 2) {144                     strVar += "<li class=\"mui-table-view-cell\">";145                     strVar += "<a class=\"co888\">";146                     strVar += "                        失败原因";147                     strVar += "<span class=\"mui-pull-right co000\">" + (item.Message == null ? "" : item.Message) + "<\/span>";148                     strVar += "<\/a>";149                     strVar += "<\/li>";150                 }151                 strVar += "<\/ul>";152                 strVar += "<\/li>";153 154                 $("#" + obj.id).append(strVar);155             }156         });157 }