2013-05-07 4 views
-1

iscroll에 약간의 문제가 있습니다. 나는 phonegap 및 jquery 모바일과 함께 iphone을위한 작은 앱을 만들고있다. json에서 가져온 외부 데이터와 iscroll 및 data-iscroll = ""을 사용한다.리스트 뷰의 내용을로드 할 때 iscroll은 훌륭하게 작동하지만, 나가 다른 기사에서 돌아 오면, iscroll은 그 위치를 기억하고, 나는 페이지의 꼭대기에서 할 수 있었으면 좋겠다.jquery mobile 및 iscroll 새로 고침

티 내 예 도움말 http://www.viaggiosullaluna.it/es.zip

타이입니다.

답변

3

iScroll4에는 .refresh() 메서드가 있습니다. 새로운 기사를 호출 (및 스크롤 내용을 변경하는 모든 기능에 대한) 함수의 끝에 다음을 추가

var myScroll = new iScroll('idOfElement', {/*options*/}); 

:

당신은 당신의 iscroll 인스턴스를 만들려면이 같은 것을 사용 고려

setTimeout(function() { 
    myScroll.refresh(); 
}, 100); 

이렇게하면 스크롤 영역의 높이를 다시 계산하고 스크롤을 다시 실행합니다.

myScroll.scrollTo(0, 0); 

기타 문서 상태 scrollTo(x, y, time, relative) : 더 많은 정보를 들어, 다음 사용

맨 위로 스크롤하려면 http://cubiq.org/iscroll-4

업데이트에 MASTERING THE REFRESH() METHOD를 참조하십시오. time (스크롤하는 '애니메이션'의 경우), relative은 현재 요소 (사용자가 원하지 않는 요소)를 기준으로 스크롤합니다. 더 많은 정보를 들어

, 나는 아주 잘 이해하지 못하는, http://cubiq.org/iscroll-4

+0

답장을 보내 주셔서 감사합니다,하지만 내 문제는 다른, 나는 내부 페이지에서 작동 iscroll 내 문제를 설명하려고하지만, 난 다시 눌러 경우 아래 페이지로 돌아 다른 하나는 iscroll이 당신이 떠난 동일한 위치에 놓여 있고 페이지의 시작 부분을 시작하고 싶습니다. – Bambo

+0

@Bambo가 지금 내게 말한 코드로 업데이트되었습니다. – RaphaelDDL

0

미안 해요에서 JAVASCRIPT SCROLLING를 참조하십시오. 불행히도 J를 가진 에이스가 아닙니다. 내 코드에 myScroll.scrollTo (0, 0) 함수를 삽입하는 방법을 이해해야합니다. 넌 정말 친절하게 도와 줬어. 나는이 세 가지 기능 사용

JAVASCRIPT

$("#malattie_page").live("pageinit", function() { 
}); 
$("#malattie_interno_page").live("pageinit", function() { 
}); 

$("#malattie_page").live("pagebeforeshow", function(event,data) { 
$.ajax({ 
    url: "http://www.viaggiosullaluna.it/ipediatria_admin/json/malattie.php",  
    type: 'post', 
    dataType: 'json', 
    crossDomain : true, 
    async:false, 
    success: function(retval, textStatus){    
     var html = "<ul id='lista_malattie' data-role='listview' data-autodividers='true' data-filter='true' data-filter-placeholder='Search...'>"; 
     for (var i=0; i<retval.length; i++) { 
      html += "<li><a href='#malattie_interno_page' data-transition='slide' class='contentLink' data-entryid='"+retval[i]['id']+"' >"+retval[i] ['title']+"</a></li>"; 
     } 
     html += "</ul>"; 
     $("#interno_malattie").html(html); 
     $("#lista_malattie").listview(); 
    } 
}); 
}); 
$("#malattie_interno_page").live("pagebeforeshow", function(event,data) { 
$.ajax({ 
    url: "http://www.viaggiosullaluna.it/ipediatria_admin /json/malattie.php?id="+selectedEntry, 
    type: 'post', 
    dataType: 'json', 
    crossDomain : true, 
    async:false, 
    success: function(retval, textStatus){  
     var html ="" 
     for (var i=0; i<retval.length; i++) { 
      if(selectedEntry == retval[i]['id']) { 
       html += "<h3>"+retval[i]['title']+"</h3>"; 
       html += "<div class='interno'>"+retval[i]['content']+" </div>"; 
      } 
     } 
     $("#interno_malattie_page").html(html); 
    } 
    }); 
    }); 

    $("#malattie_page").live("pageshow", function(prepage) { 
}); 
$("#malattie_interno_page").live("pageshow", function(prepage) { 
setTimeout(function(){$('#malattie_interno_page [data- role="content"]').iscrollview('refresh');}, 0); 
}); 

및 HTML을

그냥이 시도 의미 iscrollview를 사용하는 경우
<!-- PAGE MALATTIE --> 
    <div data-role="page" class="ui-responsive-panel" id="malattie_page"> 
     <div data-role="header" data-theme="f" data-position="fixed"> 
      <h1>MALATTIE</h1> 
      <a href="#nav-panel" data-icon="bars" data-iconpos="notext">Menu</a></div><!-- /header --> 
     <div data-role="content" data-iscroll=""> 
      <div id="interno_malattie"> 

      </div> 
     </div><!-- /content -->   

     <div data-role="panel" data-position="left" data-position-fixed="false" data-display="reveal" id="nav-panel" data-theme="a"> 
      <ul data-role="listview" data-theme="a" data-divider-theme="a" style="margin-top:-16px;" class="nav-search"> 
       <li data-icon="delete" class="close-button"><a href="#" data-rel="close">MENU INTERNO</a></li> 

       <li><a href="#malattie_page" data-transition="fade">PAGE</a></li> 
      </ul> 
     </div><!-- /panel -->   
    </div><!-- /page --> 


    <!-- PAGE MALATTIE INTERNO PAGINA --> 
    <div data-role="page" class="ui-responsive-panel" id="malattie_interno_page"> 
     <div data-role="header" data-theme="f" data-position="fixed"> 
      <h1>MALATTIE</h1> 
      <a href="#malattie_page" data-rel="back" data-transition="slide" data-direction="reverse">Back</a> 
     </div><!-- /header --> 
     <div data-role="content" data-iscroll=""> 
      <div id="interno_malattie_page"> 


      </div> 
     </div><!-- /content -->   

     <div data-role="panel" data-position="left" data-position-fixed="false" data-display="reveal" id="nav-panel" data-theme="a"> 
      <ul data-role="listview" data-theme="a" data-divider-theme="a" style="margin-top:-16px;" class="nav-search"> 
       <li data-icon="delete" class="close-button"><a href="#" data-rel="close">MENU INTERNO</a></li> 

       <li><a href="#malattie_page" data-transition="fade">PAGE</a></li> 

      </ul> 
     </div><!-- /panel -->   
    </div><!-- /page --> 
0

... 1.refresh

$('#videotagisc').iscrollview("refresh"); 

2.scrollTo

$('#videotagisc').iscrollview('scrollTo', 0,0); 
관련 문제