jquerymobile - .js 및 .html 포함

제 신청서에는 콘텐츠를 표시하는 데 html 페이지 이상을 사용하며 각 페이지에는 .js 파일이 있습니다. html 페이지를 호출하면 .js 파일도 포함됩니다. .js에서 나는 $('div').live('pageshow',function(){})을 사용하고 있습니다. 에서 html 파일을 호출합니다. js(using $.mobile.changePage("htmlpage")).jquerymobile - .js 및 .html 포함

내 문제 : 두 html 파일이 있습니다. one.html 파일이 one.js 파일과 함께 호출됩니다. second.html을 표시하면 one.js가 다시로드됩니다. 나는

one.js Second.html

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Sample </title> 
    <link rel="stylesheet" href="../jquery.mobile-1.0a2.min.css" /> 
    <script src="../jquery-1.4.3.min.js"></script> 
    <script src="../jquery.mobile-1.0a2.min.js"></script> 
    <script type="text/javascript" src="Scripts/second.js"></script> 
    </head> 
    <body> 
    <div data-role="page"> 
     <div data-role="button" id="link" >Second</div> 
    </div><!-- /page --> 
    </body> 
</html>

다음 "second.js"

<!DOCTYPE html> <html> <head> <title>Page Title</title> <link rel="stylesheet" href="jquery.mobile-1.0a2.min.css" /> <script src="jquery-1.4.3.min.js"></script> <script src="jquery.mobile-1.0a2.min.js"></script> <script src="Scripts/one.js"></script> </head> <body> <div data-role="page"> </div> </body> </html>

one.html "one.js"경고를 얻고있다
$('div').live('pageshow',function() { alert("one.js"); //AJAX Calling //success result than call the second.html $.mobile.changePage("second.html"); });

second.js

$('div').live('pageshow',function(){ { alert('second.js'); //AJAX Calling //success result than call the second.html $.mobile.changePage("third.html"); });

참고 : 내가 그 시간 forth.html 표시하면 다음 파일이 다시로드 (one.js, second.js, 셋째, JS와 fourth.js 있습니다. 하지만 네 번째가 필요해. 혼자 야.) $ .document.ready (function() {})를 사용하려고했습니다. 하지만 .js는 전화하지 않았습니다.

출처

2011-01-10 Finder

당신은 당신이 요구하는 것을 명확히하기 위해 코드의 일부를 게시해야한다 감지 . – jmort253

안녕하세요 ..샘플 코드로 게시했습니다. 도와주세요. – Finder

second.html을 표시 할 때 페이지를 완전히 새로 고치고 있습니까 아니면 Ajax를 사용하여 페이지를로드하고 있습니까? – jmort253

pageshow 이벤트는 페이지가로드 될 때마다 실행되는 JavaScript 함수를 바인딩합니다. 두 번째 페이지를로드 할 때 실제로 생성 할 필요가없는 또 다른 페이지 쇼 기능을 만듭니다.

이것은 당신이 한 번 정의하고 경우에만 경우, 문제를 해결하는 데 도움이해야합니다 당신이 페이지를 전환 할 때

$('div').live('pageshow',function(event, ui){ 
    alert('This page was just hidden: '+ ui.prevPage); 
}); 

$('div').live('pagehide',function(event, ui){ 
    alert('This page was just shown: '+ ui.nextPage); 
});

이 그냥 같이 무슨 페이지에 당신을 알려줍니다, 어떤 페이지는 단지 숨겨져 있었다.

위대한 자원 :
http://jquerymobile.com/demos/1.0a2/#docs/api/events.html

http://forum.jquery.com/topic/mobile-events-documentation

출처

2011-01-10 04:47:50 jmort253

안녕하세요, 저는이 책에 아주 익숙합니다. 나는 옆에서 배우고있다. 어떻게 할 수있게 도와 주실 수 있겠습니까? – Finder

@Girija - 내 편집을 참조하십시오. – jmort253

$ ('div [data-role = "page"]')를 호출합니다. unbind(); 두 번째 페이지를 이동하기 전에 그러나 아직도 그것은 부르고있다.alert ("one.js"); // AJAX Call// 성공 결과가 second.html을 호출하는 것보다 $ ('div [ unbind ('pageshow'); $ .mobile.changePage ("second.html"); }); 미리 감사드립니다. – Finder

(초보자 여기 죄송합니다, SO) oers 코멘트 당 편집 : 여기

현재 HTML 페이지를 기반으로 JS 파일을로드에 대한 대체 방법입니다

응용 프로그램의 모든 페이지에 포함되어 있지만 'bootstrapper'파일 이상으로 작동하는 단일 스크립트 파일이 있어야합니다 e는 현재 페이지를 탐지 한 다음 JavaScript 파일을 DOM에 삽입합니다.

는 는 자바 스크립트 삽입합니다이 기능

function insertScript(script, container) { 
    var elem = document.createElement('script'); 
    elem.type = 'text/javascript'; 
    elem.src = 'Assets/Scripts/' + script + '.js'; 
    container.appendChild(elem); 
}

그리고이 코드는 현재 페이지를

// The 'pagechange' event is triggered after the changePage() request has finished loading the page into the DOM 
// and all page transition animations have completed. 
// See: https://gist.github.com/1336327 for some other page events 
$(document).bind('pagechange', function(event){ 

// grab a list of all the divs's found in the page that have the attribute "role" with a value of "page" 
    var pages = $('div[data-role="page"]'), 
    // the current page is always the last div in the Array, so we store it in a variable 
    currentPage = pages[pages.length-1], 
    // grab the url of the page the was loaded from (e.g. what page have we just ajax'ed into view) 
    attr = currentPage.getAttribute('data-url'); 

// basic conditional checks for the url we're expecting 
if (attr.indexOf('home.html') !== -1) { 
    // now we know what page we're on we can insert the required scripts. 
    // In this case i'm inserting a 'script.js' file. 
    // I do this by passing through the name of the file and the 'currentPage' variable 
    insertScript('search', currentPage); 
} 

// rinse and repeat... 
if (attr.indexOf('profile.html') !== -1) { 
    insertScript('profile', currentPage); 
} 

});

Reference Link

출처

2011-11-30 14:32:30 DevIntern

스택 오버플로에 오신 것을 환영합니다! 이것은 이론적으로 질문에 대답 할 수 있지만 여기에 답의 핵심 부분을 포함하고 참조 용 링크를 제공하는 것이 바람직합니다 (http://meta.stackexchange.com/q/8259). – oers

jquerymobile - .js 및 .html 포함

답변

관련 문제