JQuery : 하나의 페이지로 여러 페이지 결합하기

phonegap과 jQuery Mobile을 사용하여 애플리케이션을 개발 중입니다. Phonegap은 단일 문서 구조를 권장합니다. 문서에서 5 개 이상의 div가 명확하지 않으므로 내 페이지 (div의)를 여러 문서로 분리하려고합니다. phonegap이 앱을로드하자마자이 문서들을 index.html에 삽입하고 싶습니다.JQuery : 하나의 페이지로 여러 페이지 결합하기

function loadPage(external_document) { 
    var docname=external_document+".html"; 
    $.get(docname, function(data) { 
     console.log(docname+" loading"); 
     $("body").append($(data).find("body")); 
     $("head").append($(data).find("head")); 
     console.log(docname+" loaded"); 
    }); 

} 

document.addEventListener("deviceready", function(){ 
    loadPage("DialogCredentials"); 
}, false);

는 DialogCredentials.html는

<html> 
<head> 
    <script type="text/javascript" src="js/DialogCredentials.js"></script> 
</head> 
<body> 
    <div data-role="page" id="dlg_credentials"> 
    <div data-role="header"><h1>Login</h1></div> 
    <div data-role="content"> 
    ... 
</div> 
</div><!-- /page --> 
</body> 
</html>

는 즉시 loadPage이 실행됩니다 같은 <div id="dlg_credentials"…이 있어야하고 내 주요 문서의 DOM에서 자바 스크립트 태그를 해당. 그러나 그렇지 않습니다. 웹 속성에 오류가 표시되지 않습니다. 그래서 여기서 내가 뭘 잘못하고 있니?

출처

2012-09-18 gorootde

당신은 정말 쉽게 코딩 내가 페이지 jQuery를 모바일 즉

$.mobile.changePage("about/us.html", { transition: "slideup"});

이 방법으로 당신을위한 표준 방법을로드하는 것이 좋습니다 수 있도록 페이지를 분리하려는 경우, 당신을위한 테스트 케이스를 설정하지 않고 바퀴를 다시 발명하지 않으며 귀하의 요청을 만족시킵니다. 오버 헤드는 어떤 경우에도 html이 렌더링되기 전에 많은 페이지를 삽입하여 차단하는 것보다 첫 번째 페이지를 빨리 렌더링하려는 경우를 고려하여 제안 된 솔루션에 비해 무시할 수 없을 것입니다. 어떤 경우에도 Phonegap이 장치에 로컬로있을 것이므로 매우 신속하게 서비스를 제공 할 수 있습니다. jQuery를 모바일을 통해 페이지를로드 할 때 기억해야 할

한 가지는 그것이 내가 당신이 포함 추천 할 것입니다 사용자 정의 페이지 별 자바 스크립트를로드하기 때문에

data-role="page|dialog|popup"

태그의 외부 대상 페이지에서 아무것도를 스트립하고 있다는 것입니다 직접

data-role="page"

여는 태그 아래 스크립트 태그는 "pageinit"

<div data-role="page" id="options" data-theme="a"> 
<script type="text/javascript"> 
    $(document).bind('pageinit', initializeOptions()); 
    function initializeOptions() { 
     // do your page initialization here . . . 
    } 
</script> 
<!-- rest of page continues here . . . . -->

에서 발생하는 모든 페이지 초기화 설정

그런 다음 필요에 따라 나머지 페이지를 계속 진행하십시오. 그렇게하면 페이지가 $ .mobile.changePage 메소드를 통해로드 될 때 구문 분석됩니다.

희망이 있습니다.

출처

2012-09-18 20:20:09

동적로드는 몇 가지 Javascript 프레임 워크의 기능입니다. AngularJS 및 Backbone.js를 예로들 수 있습니다. 어쩌면 여러보기를로드하는 접근 방식을 살펴볼 수 있습니까?

각 뷰의 빈 div를 index.html에 추가 한 다음 필요에 따라 각 뷰의 자바 스크립트를 동적으로로드하여 이전에이 작업을 수행 한 앱에서 작업했습니다. 뷰의 자바 스크립트는 HTML을 해당 뷰의 div로 렌더링하는 역할을 담당했습니다.

출처

2012-09-18 15:18:50

JQuery : 하나의 페이지로 여러 페이지 결합하기

답변

관련 문제