iScroll을 JQM 및 동적 콘텐츠와 함께 사용

Question

jQuery를 사용하여 HMTL5 게임에 iScroll을 구현하려고합니다. 나는 그것이 작동하도록 할 수없는 것 같아? http://www.gajotres.net/using-iscroll-with-jquery-mobile/ 여기

은 내가 뭘하려고 오전입니다 : : 여기 가이드를 따라 한

$(document).on('pagebeforeshow', '#index', function(){ 
    $(".example-wrapper").html(""); 

    var html = '<ul data-role="listview">'; 
    for(i = 0; i < 30; i++) { 
     html += '<li><a href="#">link '+i+'</a></li>'; 
    } 
    html += '</ul>'; 
    $(".example-wrapper").append(html); 
    $(".example-wrapper").iscrollview("refresh"); 
}); 

프로젝트의 차이는 내가 할 수없는 ... 그것은 트리거를 사용하고 내가 APPEND 사용하고 있다는 것입니다 연결이 안되니?

내 예는 여기 jsfiddle에 : http://jsfiddle.net/jmansa/952NJ/23/이

Answer 1

iScroll 동적으로 스크롤 할 수있는 요소를 포함하는 DIV를 생성하고, 그 DIV 클래스 iscroll-content 있습니다.

<div class="example-wrapper" data-iscroll></div> 

은 사용 그래서 $(".example-wrapper").html("") 대신, 당신은 이전 내용/요소를 취소 $(".example-wrapper .iscroll-content").html("")를 사용해야 사업부의 모든 내용을 제거

<div class="example-wrapper" data-iscroll> 
    <div class="iscroll-content"></div> 
</div> 

된다.

또한, iscroll-content에 새로운 요소를 추가해야하고, 다음 는 모두 listview() 및 .iscrollview()를 새로 고칩니다.

$(document).on('pagebeforeshow', '#index', function() { 
    $(".example-wrapper .iscroll-content").html(""); 

    var html = '<ul data-role="listview">'; 
    for (i = 0; i < 30; i++) { 
     html += '<li><a href="#">link ' + i + '</a></li>'; 
    } 
    html += '</ul>'; 

    $(".example-wrapper .iscroll-content").append(html); 
    $("[data-role=listview]").listview(); 
    $(".example-wrapper").iscrollview("refresh"); 
}); 

Demo