疑点颇多
疑点颇多
  • 发布:2015-06-15 14:45
  • 更新:2015-06-15 16:08
  • 阅读:1642

急急急,mui.js版本升级后上拉刷新报错了

分类:MUI
mui

之前用的是mui的1.6版本,现在升级到1.8之后,上拉刷新报错了

Uncaught TypeError: Cannot read property 'classList' of undefined at js/mui.js:2660

mui.js中的代码
_initPullupRefresh: function() {
this.pulldown = false;
this.pullPocket = this.bottomPocket;
this.pullPocket.classList.add(CLASS_BLOCK);
this.pullPocket.classList.add(CLASS_VISIBILITY);
this.pullCaption = this.bottomCaption;
this.pullLoading = this.bottomLoading;
},

报错的是这行 this.pullPocket.classList.add(CLASS_BLOCK);

请问现在上拉刷新的写法什么改变吗?

2015-06-15 14:45 负责人:无 分享
已邀请:
DCloud_UNI_FXY

DCloud_UNI_FXY

贴一下页面的完整代码

疑点颇多

疑点颇多 (作者)

Html 代码
<div class="mui-content">
<div id="pullrefresh" class="mui-scroll-wrapper" style="top:40px;">
<div class="mui-scroll">
<ul id="goodsList" class="mui-table-view">
</ul>
</div>
</div>
</div>

JS代码
/**

  • ===================================
  • 找货JS
  • ===================================
    */
    AppUtils.init({
    swipeBack: false,
    pullRefresh: {
    container: '#pullrefresh',
    up: {
    contentrefresh: '正在加载数据',
    callback: doSearch
    }
    }
    });
    //自动刷新记时器
    var timer = null;
    //是否需要刷新页面
    var refresh = true;
    //最新的货源ID
    var newGoodsId = "";
    //第一个显示的货源ID
    var firstGoodsId = "";
    var page = 1;
    var limit = 10;

//取得storage中保存的数据
var param = AppUtils.getItem("find_goods_condition");

if (AppUtils.esapeNull(param) == "") {
//storage=null的时候
param = new Object();
//定位
getLocation();
} else {
//storage中有数据时
if (AppUtils.esapeNull(param.dispatch_name) != "") {
document.querySelector("#dispatch span").innerText = AppUtils.esapeNull(param.dispatch_name);
}
if (AppUtils.esapeNull(param.receipt_name) != "") {
document.querySelector("#receipt span").innerText = AppUtils.esapeNull(param.receipt_name);
}
if (AppUtils.esapeNull(param.type) != "") {
document.querySelector("#type span").innerText = AppUtils.esapeNull(param.type);
}
if (AppUtils.esapeNull(param.length_name) != "") {
document.querySelector("#length2 span").innerText = AppUtils.esapeNull(param.length_name);
}
timer_start();
}
/**

  • 自动刷新数据
    /
    function autoSearch() {
    var tempParam = new Object();
    tempParam.page = 1;
    tempParam.limit = limit;
    if (AppUtils.esapeNull(param.dispatch) != "" && param.dispatch != "999999") {
    tempParam.dispatch = param.dispatch;
    }
    if (AppUtils.esapeNull(param.receipt) != "" && param.receipt != "999999") {
    tempParam.receipt = param.receipt;
    }
    if (AppUtils.esapeNull(param.type) != "" && param.type != "不限车长") {
    tempParam.type = param.type;
    }
    if (AppUtils.esapeNull(param.length) != "" && param.length != "0") {
    tempParam.length = param.length;
    }
    AppUtils.ajaxPost("findgoods.mdo", tempParam, function(jsonData) {
    if (jsonData.status == "OK") {
    if (jsonData.rows.length > 0) {
    newGoodsId = AppUtils.esapeNull(jsonData.rows[0].goodsid);
    if (firstGoodsId != "" && newGoodsId != "" && firstGoodsId != newGoodsId) {
    firstGoodsId = newGoodsId;
    AppUtils.playSound();
    }
    if (refresh) {
    showList(jsonData);
    setTimeout(function() {
    mui('#pullrefresh').pullRefresh().refresh((limit
    page) < jsonData.results);
    mui('#pullrefresh').pullRefresh().endPullupToRefresh((limit * page) >= jsonData.results);
    }, 300);
    }
    }
    } else {
    AppUtils.showAlert(data.message);
    if (data.errorcode == "NEEDRELOGIN") {
    AppUtils.openWindow('login.html');
    }
    }
    }, {
    noWaiting: true
    });
    }

/**

  • 手动查询数据,用于翻页查看的情况
    */
    function doSearch() {
    page++;
    var tempParam = new Object();
    tempParam.page = page;
    tempParam.limit = limit;
    if (AppUtils.esapeNull(param.dispatch) != "" && param.dispatch != "999999") {
    tempParam.dispatch = param.dispatch;
    }
    if (AppUtils.esapeNull(param.receipt) != "" && param.receipt != "999999") {
    tempParam.receipt = param.receipt;
    }
    if (AppUtils.esapeNull(param.type) != "" && param.type != "不限车长") {
    tempParam.type = param.type;
    }
    if (AppUtils.esapeNull(param.length) != "" && param.length != "0") {
    tempParam.length = param.length;
    }

    AppUtils.ajaxPost("findgoods.mdo", tempParam, function(jsonData) {
    if (jsonData.status == "OK") {
    if (jsonData.rows.length > 0) {
    showList(jsonData);
    }
    setTimeout(function() {
    mui('#pullrefresh').pullRefresh().refresh((limit page) < jsonData.results);
    mui('#pullrefresh').pullRefresh().endPullupToRefresh((limit
    page) >= jsonData.results);
    }, 300);
    } else {
    AppUtils.showAlert(data.message);
    if (data.errorcode == "NEEDRELOGIN") {
    AppUtils.openWindow('login.html');
    }
    }
    }, {
    noWaiting: true
    });
    }

/**

  • 显示货物列表
  • @param {Object} data
    */
    function showList(data) {
    if (page == 1) {
    //记录第一个货物的ID
    firstGoodsId = AppUtils.esapeNull(data.rows[0].goodsid);
    }
    var ul = document.getElementById("goodsList");
    var new_ul = null;
    if (refresh) {
    //自动刷新页面时,创建新的ul对象
    new_ul = document.createElement("ul");
    new_ul.setAttribute("id", "goodsList");
    new_ul.setAttribute("class", "mui-table-view");
    }
    for (var i = 0; i < data.rows.length; i++) {
    var li = showListItem(data.rows[i]);
    if (refresh) {
    new_ul.appendChild(li);
    } else {
    ul.appendChild(li);
    }
    }
    if (refresh) {
    //替换画面上原有内容
    document.getElementById("pullrefresh").querySelector(".mui-scroll").replaceChild(new_ul, ul);
    if (page == 1) {
    mui('.mui-scroll-wrapper').scroll().scrollTo(0, 0);
    }
    }
    }

function showListItem(item) {
var li = document.createElement("li");
li.setAttribute("class", "mui-table-view-cell");
li.setAttribute("id", item.goodsid);
var html = '';
html += '<div>';
html += ' <span><b>';
html += item.dispatchname;
html += '→';
html += item.receiptname;
html += ' </b></span>';
if (/^([0-3])分钟$/.test(item.reducemin)) {
html += ' <span class="imgWord red">新</span>';
}
if ("1" == AppUtils.getUserInfo().auth) {
html += ' <span class="mui-pull-right"><b>';
html += item.username;
html += ' </b></span>';
}
html += '</div>';
html += '<div> ';
html += ' <span>' + createGoodsInfo(item) + '</span> ';
html += '</div> ';

if ("1" == AppUtils.getUserInfo().auth) {  
    html += '<div> ';  
    html += '   <span>席位:' + AppUtils.esapeNull(item.authdep) + AppUtils.esapeNull(item.seat) + '</span> ';  
    html += '   <span name="btn">';  
    html += '       <a name="' + item.tel + '">';  
    html += '           <i class="iconfont mui-pull-right" style="color: #159677; font-size:40px;">&#xe61e;</i>';  
    html += '       </a>';  
    html += '   </span>';  
    html += '</div> ';  
}  
html += '<div > ';  
html += '<span>发布时间:' + item.registdate + '</span> ';  
html += '</div> ';  
li.innerHTML = html;  
if (li.querySelector("a") != null) {  
    li.querySelector("a").addEventListener('tap', function(e) {  
        e.stopPropagation();  
        AppUtils.dial(this.name);  
    });  
}  
li.addEventListener('tap', function() {  
    var goodsid = this.getAttribute("id");  
    AppUtils.openWindow("goodsSource_detailforCar.html", {  
        goodsid: goodsid,  
        fromPageType: "findgoods"  
    });  
});  
return li;  

}

function createGoodsInfo(item) {
var array = new Array();
// 货物名称
array.push(item.goodsname);
// 货物单位
array.push(item.qorv);
// 车长
if (item.length != null && item.length != '' && item.length != 0) {
if (item.length != "不限车长")
array.push(item.length + '米');
}
// 车型
if (item.type != null && item.type != '' && item.type.substr(0, 2) != '不限') {
array.push(item.type);
}
// 货源信息
var goodsInfo = "";
var count = 0;
for (var j = 0; j < array.length; j++) {
if (AppUtils.esapeNull(array[j]) != "") {
if (count > 0) {
goodsInfo += "/";
}
goodsInfo += array[j];
count++;
}
}
return goodsInfo;
}

function getLocation() {
AppUtils.getGeolocation(function(r) {
try {
AppUtils.convertBaidu2GPS(r, function(point) {
var condition = "type=2";
condition += "&location=" + point.lng + "," + point.lat;
AppUtils.ajaxPost("connectloc.do", condition, function(jsonData) {
if (jsonData.status == "true") {
var dispatch_code = AppUtils.esapeNull(jsonData.code);
if (dispatch_code != "") {
if (new RegExp("^11").test(dispatch_code) || new RegExp("^12").test(dispatch_code) || new RegExp("^31").test(dispatch_code) || new RegExp("^50").test(dispatch_code)) {
dispatch_code = dispatch_code.substr(0, 2) + "0000";
}
AppUtils.ajaxPost("getprovinceinfo.do",
"searchKbn=6&code=" + dispatch_code,
function(jsonData) {
if (jsonData.result != "NG") {
dispatch_code = AppUtils.esapeNull(jsonData.code);
param.dispatch = dispatch_code;
param.dispatch_name = jsonData.name;
document.querySelector("#dispatch span").innerText = AppUtils.esapeNull(param.dispatch_name);
}
timer_start();
});
}
}
});
}, function(e) {
timer_start();
});
} catch (e) {
timer_start();
}
});
}

function timer_stop() {
clearInterval(timer);
timer = null;
}

function timer_start() {
timer_stop();
refresh = true;
page = 0;
mui('#pullrefresh').pullRefresh().pullupLoading();
timer = setInterval(autoSearch, 12000);
}

document.getElementById("dispatch").addEventListener('tap', function() {
timer_stop();
AppUtils.openWindow("city.html", {
itemType: "dispatch",
selectedCode: param.dispatch,
selectedName: param.dispatch_name,
openerx: "findgoods.html"
});
});

document.getElementById("receipt").addEventListener('tap', function() {
timer_stop();
AppUtils.openWindow("city.html", {
itemType: "receipt",
selectedCode: param.receipt,
selectedName: param.receipt_name,
openerx: "findgoods.html"
});
});

document.getElementById("type").addEventListener('tap', function() {
timer_stop();
AppUtils.openWindow("vehicle.html", {
typeItem: "type",
code: ("" == AppUtils.esapeNull(param.type) ? '不限车型' : param.type)
});
});

document.getElementById("length2").addEventListener('tap', function() {
timer_stop();
AppUtils.openWindow("vehicle.html", {
typeItem: "length2",
code: ("" == AppUtils.esapeNull(param.length) ? '0' : param.length)
});
});

window.addEventListener("reloadPrevious", function(data) {
document.getElementById("goodsList").innerHTML = "";
console.log(JSON.stringify(data.detail));
document.getElementById(data.detail.typeItem).querySelector("span").innerText = data.detail.name;
if (data.detail.typeItem == "type") {
param.type = data.detail.code;
}
if (data.detail.typeItem == "length2") {
param.length = data.detail.code;
param.length_name = data.detail.name;
}
AppUtils.setItem("find_goods_condition", param);
timer_start();
});

window.addEventListener("reloadPageAfterCity", function(data) {
document.getElementById("goodsList").innerHTML = "";
console.log(JSON.stringify(data.detail));
var showname = data.detail.name;
if (showname.length > 4) {
showname = showname.substr(0, 2) + "...";
}

document.getElementById(data.detail.itemType).querySelector("span").innerText = showname;  
if (data.detail.itemType == "dispatch") {  
    param.dispatch = data.detail.code;  
    param.dispatch_name = showname;  
}  
if (data.detail.itemType == "receipt") {  
    param.receipt = data.detail.code;  
    param.receipt_name = showname;  
}  
AppUtils.setItem("find_goods_condition", param);  
timer_start();  

});

document.getElementById("pullrefresh").addEventListener('scrollend', function(e) {
var scrollTop = document.body.scrollTop || e.detail.y;
if (scrollTop == 0) {
page = 1;
refresh = true;
} else {
refresh = false;
}
});

document.addEventListener('pageReload', function() {
autoSearch();
});

DCloud_UNI_FXY

DCloud_UNI_FXY

发个测试工程吧。代码太多了。单看比较费劲

  • 疑点颇多 (作者)

    算了,这本画面写的一坨屎,我打算重写了

    2015-06-15 17:01

  • 6***@qq.com

    请问这个是怎么解决的? 我的现在也会报这个错误

    2017-02-06 15:36

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