2014-11-15 4 views
0

동일한 페이지를 두 번 이상 여는 것에 비해 상대적으로 처리하는 방법을 이해하지 못하는 코도바 문제가 있습니다.코드 페이지에서 페이지 새로 고침

<!DOCTYPE html> 
<html> 
<head> 
    <title> 
     ciao 
    </title> 
    <meta charset="UTF-8"> 

    <!-- cordova --> 
    <script type="text/javascript" charset="utf-8" src="cordova.js"></script> 

    <!-- jquery mobile --> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="js/libs/jquery-mobile/jquery.mobile.css" /> 
    <script src="js/libs/jquery/jquery.js"></script> 
    <script src="js/libs/jquery-mobile/jquery.mobile.js"></script> 

    <!-- initialization files --> 
    <script src="js/mainjs.js"></script> 
</head> 
<body> 
    <section id="index" data-role="page" data-fullscreen="true"> 
     <div data-role="content"> 
      /*...*/ 
      <a href="mappa.html"> 
         <img src="img/map.png" /> 
      </a> 
      /*...*/ 
     </div> 
    </section> 
</body> 
</html> 

이 mappa.html

<!DOCTYPE html> 
<html> 
<head> 
    <title> 
     mappa 
    </title> 
    <meta charset="UTF-8"> 

    <!-- cordova --> 
    <script type="text/javascript" charset="utf-8" src="cordova.js"></script> 

    <!-- jquery mobile --> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="js/libs/jquery-mobile/jquery.mobile.css" /> 
    <script src="js/libs/jquery/jquery.js"></script> 
    <script src="js/libs/jquery-mobile/jquery.mobile.js"></script> 

</head> 
<body> 
    <section id="mappa" data-role="page" data-fullscreen="true"> 
     <div data-role="content"> 
      /* code*/ 
     </div> 
    </section> 
</body> 
</html> 

지금 내가로드해야

index.html을 :

내가 코르도바와 JQuery와 모바일 지원과 같은 두 가지 기본 HTML 파일이 있다고 가정하자 데이터를 mappa.html 파일에 저장하면 mainjs.js 파일에서로드하도록 선택한 핸들러를 사용할 수 있습니다.

$(document).ready(function() { 
console.log("deviceready"); 
$(document).on("pageshow","#mappa",function(){  //pageshow is thrown each time 
       /*code*/ 
      }); 
}); 

내가 때마다 위의 코드를 사용하는 경우 내가 모든 핸들러를 다시 시작 페이지를로드하고 데이터 다운로드와 같은 긴 작업의 경우 비우호적 매우 사용자입니다.

그래서 난이 핸들러

$(document).one("pageshow","#mappa",function(){ }); 

을 시도하지만 핸들러가 작업을 2 회 does't 때문에 내가 mappa.html 페이지에 입력 한 두 번째는 단순히 비어 있습니다.

어떻게 페이지를로드 할 수 있습니까?

편집 :이 특정 경우에는 내가지도를로드하고이 코드

$(document).on("pageshow","#mappa",function(){  //pageshow is thrown each time 
    console.log("dentro script"); 
    //setting div height 
    $("#map_canvas").height($(window).height() - $("div[data-role='header']").height() - 32); 

    //since page show is thrown each time i use a session storage variable 
    //so i make the init map only one time 
    if(!sessionStorage.mapinit) { 
     console.log("----------mapinit is not set"); 
     sessionStorage.mapinit=1; 
     console.log("----------mapinit=1"); 
     // Initialize the map plugin 
     var mapDiv = document.getElementById("map_canvas"); 
     var map = plugin.google.maps.Map.getMap(mapDiv); 

     map.setMyLocationEnabled(true); 
     var pisaCenter = new plugin.google.maps.LatLng(43.723072, 10.396585); 
     map.setCenter(pisaCenter); 
     map.setZoom(13); 
     map.one(plugin.google.maps.event.MAP_READY, onMapInit); 
    } else { 
     console.log("----------map already set"); 
     var mapDiv = document.getElementById("map_canvas"); 
     var map = plugin.google.maps.Map.getMap(mapDiv); 
    } 
}); 

으로 필요하며 한 번만 onMapInit 기능을 실행

map.one(plugin.google.maps.event.MAP_READY, onMapInit); 

에 잘 덕분에 작동합니다. 그것이 내가 데이터를 내가 주요 문제가 JQuery와 모바일, 어떻게 페이지를로드 관련이

+0

'pageshow'에서 실행하는 코드를 게시하십시오. – Omar

+0

코드를로드하십시오 – LuigiDB

+0

지도를 한 번만로드 하시겠습니까? – Omar

답변

0

페이지를 열 때마다 다운로드해야한다는 터무니없는이 하나

<body> 
<script> 
    $.support.cors=true; 
    $.mobile.allowCrossDomainPages = true; 
    $.getJSON('http://.../prestazioni.php?prestazioni=tutto&callback=?',function(data){ 
     $.each(data, function(i, dat){ 
      $("#listview").append('<li>'+dat.rep+'</li>'); 
     }); 
     $('#listview').listview('refresh'); 
    }); 
</script> 
</body> 

같은

그러나 경우에

.

그래서 제 경우에는 여러 개의 html 파일을 사용하고 jquery는 열린 페이지를 캐시하지 않습니다. 이 behavoour이 아주 잘 작동이

<section id="prestazioni" data-role="page" data-fullscreen="true" data-dom-cache="true"> 

같은 페이지에서 데이터 DOM 캐시 = "true"로 추가 덮어 쓸 수 있습니다. 페이지는로드 된 상태로 유지되지만 핸들러를 사용하여 페이지를 수정할 수도 있습니다.

간단히 말해서 여러 페이지가있는 단일 HTML 파일을 만드는 간단한 경로가 있습니다. 이 경우 DOM은 항상 같고 페이지는 모두 캐시됩니다.