2011-11-15 4 views
1

두 개의 다른 페이지에 대한 링크가있는 jquery 및 jquery 모바일 라이브러리 (최신 버전)를로드하는 index.html 페이지가 있습니다.jQuery 모바일로드 동적 페이지

<a href="page2.html" class="ui-state-persist" id='some_id' data-role="button" data-theme="e" >Page2</a> 

<a href="page3.html" class="ui-state-persist" id='some_id' data-role="button" data-theme="e" >Page3</a> 

페이지 2 및 3에 맞춤 자바 스크립트 파일을 포함 할 수 있습니까? 이 page2.html 렌더링을 제대로 포함 시키면 js 파일이 무시 된 것처럼 보입니다. 이 목표는 메인 메뉴와 응용 프로그램 페이지 사이에서 자바 스크립트를로드 할 때 대기 시간을 분산시키는 것입니다.

page2.html이 :

여기
<!DOCTYPE html> 
<html> 
    <head> 
    <title>My Apptitle> 
    <meta charset="utf-8"/> 

    <!-- custom files and libraries --> 
    <script src="../js/mycode.js"></script> 
    </head> 
    <body> 

<div data-role="page" id="preTktTab"> 
<div data-role="header" data-position="inline"> 
<!-- and so on --> 

답변

0

나는 매우 비슷한 질문에 대해 다른 사람에게 준 설명입니다 : 당신이 jQuery를 모바일 프레임 워크 페이지로 이동 기본적으로 jQueryMobile page events not firing when navigating to a different html page

이 프레임 워크가 당기는 페이지를 AJAX를 통해 DOM에 추가하십시오. 이 작업을 수행하면 페이지의 첫 번째 <div data-role="page"> 요소 내의 HTML 만 잡고 나머지 페이지는 무시합니다. 따라서 이러한 페이지 뷰에 JavaScript를로드하려면 <div data-role="page"> 요소 내에 <script> 태그를 추가해야합니다. 예를 들어

변경 :

<html> 
<head> 
    <script src="..." type="text/javascript"></script> 
</head> 
<body> 
    <div data-role="page"> 
     ...mobile page here... 
    </div> 
</body> 
</html> 

사람 : 여기

<html> 
<head> 
</head> 
<body> 
    <div data-role="page"> 
     <script src="..." type="text/javascript"></script> 
     ...mobile page here... 
    </div> 
</body> 
</html> 

이 주제에 좋은 독서 (페이지 하단의 "알려진 제한 사항"주의)이다 http://jquerymobile.com/demos/1.0rc3/docs/pages/page-navmodel.html

+0

귀하의 솔루션은 Mozilla와 Chrome에서 작동했습니다. 불행히도 우리 모바일 브라우저 인 Blackberry에서는 javascript 파일을로드했지만 실행하지 못했습니다. –

+0

'eval()'을 사용하여 코드를 평가할 수 있습니다 :'eval ($ ('# page_id'). find ('script') .html());' 단지 KB 정도이므로 JS를 분할하는 것에 대해 걱정하지 않아도됩니다. – Jasper

+0

"늦은로드"자바 스크립트로 큰 JQM 기능을 구성하기위한 예제 또는 모델을 보았습니까? 당신이 이것에 대해 조금 생각한 것처럼 보입니다! –