通过JS填充DOM元素再实例化的iScroll对象不能正常运行
var viewBasic = { container:"#data-box", options:{ option:null, product_type:'pc', list_type:'harvesting', resource_type:'tmr', Period_time:null }, scroll:function(scrollId){ return new iScroll(scrollId, {snap: 'li',momentum: false,hScroll:true,hScrollbar: false,vScrollbar: false }); } }; function tickerPage(){ this.url = ''; this.columns=['AUTO','LIFE']; this.players=[null,null]; this.scrolls=[null,null]; }; tickerPage.prototype = viewBasic; tickerPage.prototype.afterEnd = function(){ this.tickerDataDemo(); /*初始化 滚动条 */ var o = this; setTimeout(function(){ for(var i=0; i< o.columns.length; i++){ o.scrolls[i] = o.scroll('listScroller_'+i); } },300); }; tickerPage.prototype.tickerDataDemo = function(){ var o = this,str = ""; str +=' <div id="data-list">'; for(var i=0; i< o.columns.length; i++){ str +=' <div class="data-list-item">'; str +=' <div class="data-list-bar">'; str +=' <label>'+o.columns[i]+'</label>'; str +=' </div>'; str +=' <div class="data-list-content">'; str +=' <div class="wrapper" id="listScroller_'+i+'">'; str +='<div class="scroller"><ul></ul></div>'; str +=' </div>'; str +=' </div>'; str +=' </div>'; } str +=' </div>'; $(this.container).html(str); /* 模拟数据 begin*/ var dom = new Array; for(var j=0; j<20; j++){ dom.pushu( "<li>test example ...</li>") } /* 模拟数据 end*/ for(var i=0; i<2; i++){ o.addItems(i,dom) } } tickerPage.prototype.addItems = function(i,dom){ var o = this,target = $("#listScroller_"+i+" > .scroller:first"); var elms = "",w = target.width(); for(var n=0; n<dom.length; n++){ elms += dom[n]; } /* 1：向前填充数据 2：修改上下错落样式 --> 修改容器宽度 3：滚动条移动到第一个元素 */ $("ul:first",target).prepend(elms); o.setItemsPadding(target); var unitWidth = $("li",target).length == 0 ? 0:$("li:first",target).width(); var wrapperWidth = w + unitWidth * dom.length; target.width(wrapperWidth); if(o.scrolls[i]){ o.scrolls[i].refresh; o.scrolls[i].scrollToElement('li:nth-child(1)',800); } } var view = new tickerPage() view.tickerDataDemo()
通过以上方法实例化出来的 iscroll 对象不能正常工作。不知道是哪里的问题
虽然有点长，还是希望大家可以看完他
如果我没看错的话，最后addItem的时候你传到scroll:function(scrollId)这里的scrollId是0,1吧？
这里对么？我用过iScroll记得第一个参数传的是一个DOM节点。就算可以传DOM节点的ID，你这里传进去的是0跟1，也找不到这样的DOM节点吧？
o.setItemsPadding(target); 这行可以注释掉
下面是他们提供的案例代码
JavaScript code?123456789101112131415 var myScroll; function loaded() { myScroll = new iScroll('wrapper', { snap: true, momentum: false, hScrollbar: false, onScrollEnd: function () { document.querySelector('#indicator > li.active').className = ''; document.querySelector('#indicator > li:nth-child(' + (this.currPageX+1) + ')').className = 'active'; } }); } document.addEventListener('DOMContentLoaded', loaded, false);