2011-08-03 3 views
2

jQuery 모바일을 사용하여 사용자 입력에 따라 사용자 지정 콘텐츠가 삽입 된 동적 '페이지'템플릿을 사용하고 있습니다.동적 페이지 캐싱 jQuery 모바일을 중지하십시오

모든 것이 작동하지만 한 번 페이지가 캐시되면 캐시 된 것으로 돌아가서 새 선택을하면 새 값이 표시되지 않습니다. 나는 다음과 같은 수정 적용 시도했다 :

$('#instrument').bind('pagehide', function(){ 
    $(this).remove(); 
}); 

페이지를 제거 않지만, 다시 해당 페이지로 이동하려고하면 그것은 다시 초기화되지 않고 난 그냥 다시 밀려 점점하겠습니다 내 애플 리케이션의 시작.

pagebeforecreate을 사용하여 동적 콘텐츠를 페이지에 추가해야합니다 (실제 HTML은 중요하지 않으므로 여기에 포함하지 않습니다). 그렇지 않으면 서식이 지정되지 않습니다. pagebeforeshow을 사용하면 내용이 포맷되지 않지만 돌아가서 새 선택을하면 내용이 변경됩니다.

나는 pagebeforecreate 페이지를 캐시합니다 실현,하지만 내가 인해 내용이 내가 내 인생은 알아낼 수 없습니다에 대한 :(

서식하지 않도록 다른 방법을 사용할 수있는 표시되지 않습니다 ! pagebeforeshow를 사용해보십시오

답변

5

해결하지만 페이지가 모든 서식을 해결하기 위해 표시 될 때 page() 호출이 같이

:.

$('#instrument').bind('pagebeforeshow', function() { 
    // Do your content insertion 
}); 

$('#instrument').bind('pageshow', function() { 
    $(this).page(); 
}); 
0123을

페이지가 업데이트되면 서식이 업데이트되지 않으므로 this trick : 임시 요소에 페이지를 래핑하고 래퍼에 page()을 호출하면 "반쪽"만 작동합니다.

$('#instrument').bind('pageshow', function() { 
    $(this).wrap('<div id="temporary-instrument-wrapper">'); 
    $('#temporary-instrument-wrapper').page(); 
    $(this).unwrap(); 
}); 
+0

감사합니다 댄, 두 번째 아이디어가 정말 효과가! 나는 그냥 (내가 완전히 교체 할 필요) 기존 내용에 추가 중지 pagehide''에 동적 콘텐츠를 제거했고 나는 또한 스타일이 적용되지 않은의 플래시를 중지 조금'show'와'hide' 물건을 적용 동적 값은 현재 새로 고쳐집니다. 이것에 대한 거대한 감사! –

1

새로운 DOM 캐시 관리 기능

  • http://jquerymobile.com/blog/2011/08/03/jquery-mobile-beta-2-released/
  • :에 기본적으로

    애니메이션 페이지 전환이 페이지는 에 걸 요구하기 때문에 그리고 한 당신 DOM으로 전환하는 중입니다. DOM을 탐색 할 때 페이지에 을 추가합니다. nd. 지금까지 그 페이지는 님이 전체 페이지 새로 고침을 할 때까지 계속 DOM에 머물러 있습니다. 따라서 은 항상 기기에서 메모리 천장에 도달하여 브라우저가 느려지거나 충돌 할 수 있다는 우려가있었습니다.

    Beta 2에서는 DOM을 깔끔하게 유지할 수있는 간단한 메커니즘을 추가했습니다. 은 다음과 같이 작동합니다. 페이지가 Ajax를 통해로드 될 때마다 (기술적으로는 페이지 숨김)으로 이동하면 DOM에서 제거하기 위해 플래그가 지정됩니다. 삭제 된 페이지로 돌아 가면 브라우저에서 해당 파일을 캐시에서 검색 할 수도 있고, 필요하다면 서버에서 다시 요청할 수도 있습니다. 중첩 목록의 경우 은 목록의 일부가 아닌 페이지 인 으로 이동하면 중첩 목록을 구성하는 모든 페이지를 제거합니다. 멀티 페이지 설정에 포함 된 페이지는 모두이 기능에 의해 영향을받지 않습니다 - 아약스에 의해 가져온 페이지 만 은 jQuery를 모바일로 이런 식으로 관리됩니다.

    domCache라는 새 페이지 옵션이 그들 또는 숨겨진 페이지 (새로운 방식)을 깨끗하게 DOM을 유지하고 제거 (작동하는 데 사용되는 방법 일)를 캐시하는 방법으로 DOM에 페이지를 탈퇴 여부를 제어합니다. 기본적으로 domCache는 false로 설정되어 DOM 크기를 능동적으로 관리합니다. 당신이 true로 설정 경우 장치의 범위에 철저하게 DOM에게 자신과 테스트를 관리하는데주의를 기울여야 할 필요가있다.

    선택적으로 페이지를 캐시 을 위해 개인 페이지에 domCache 옵션을 설정하려면 페이지 컨테이너에 데이터 DOM 캐시 = "true"를 속성을 추가하거나 같은 프로그램을 설정할 수 있습니다 :

    elem.page({ domCache: true }); 
    

    domCache 옵션은 전 세계적으로 설정할 수 있습니다.

    $.mobile.page.prototype.options.domCache = true; 
    
+0

필 필, 필자는 블로그 게시물을 읽고 jQuery Mobile의 버전을 업데이트했지만 응용 프로그램에는 아무런 영향이 없었습니다. 내가 작성한 방식이어야합니다. 조금 더 자세히 파헤쳐 야합니다. 감사합니다 anyhoo! –

+0

'data-dom-cache = "false"'는 내'div'에서 도움이되었습니다! – Andrew

0

내가이 간단한 솔루션으로 그 문제를 해결했습니다 :

임의와 다른 매개 변수를 추가 원래처럼 작동하므로이 다시 DOM 캐싱을 설정하는 방법입니다 http://www.yourdomain.com/ws.php?opcion=1&**cache_hack=" +Math.random();**

임의의가 있습니다와 마지막 매개 변수처럼 URL에 번호 "diferente"전화와 JQuery와 모바일 cache.-하지 않는

또한 PHP 스크립트에 추가하십시오 :

`header("Expires: Mon, 26 Jul 1997 05:00:00 GMT"); 
header("Cache-Control: no-cache"); 
header("Pragma: no-cache");` 
+0

확실히 작동하지만 SEO가 좋아한다고 생각하지 않습니다 (인터넷 페이지를 운영하는 경우). –

+0

jajajajaj 아니, 그건 사실이야;) – Vousys

관련 문제