2013-03-14 2 views
1

jQuery Mobile에서 컨트롤중인 페이지 외부에있는 nav를 사용하여 앱을 만듭니다. 각 페이지 내에서 하나의 컨테이너 밖에 복제 됨). 페이지는 '일반적인'data-role = "page1"및 data-role = "button"링크와 함께 페이지 ID에 링크되어 전달됩니다.jQuery Mobile - 페이지가로드 될 때마다 페이지로드 이후에 한 번만로드되는 페이지 별 JS (페이지가로드 될 때마다로드되지 않음)

외부 JS 파일 내에있는 각 페이지에 대해 페이지 관련 JS가 있습니다. 일련 번호로 if 문을 설정합니다. 대상 ID가 page1이면 대상 ID가 page2 인 경우 코드를 실행하십시오.

모든 페이지가 한 번만로드되면 완벽하게 작동하지만 페이지를 다시로드하면 (탐색을 통해 페이지를 다시 클릭하면) 코드가 다시 시작되지 않습니다. JS가 해당 페이지에서 처음 실행을 마쳤을 때와 동일한 상태입니다 (JS가 각 페이지에서 애니메이션을 제어 중입니다).

JS 전체를 페이지에 바인딩하고 있지만 각 페이지의 JS를 페이지에 바인딩해야합니까? 나는이 정보 조회 헛된 노력하고있어 - 난 그냥 JQ에서 시작 해요 M.

가 여기 내 JS있어 :

$(document).bind('pagecreate', function (e) { 
if (e.target.id == 'one') { 

    $('#div-one').animate({marginLeft:"500px"}); 

} 

if (e.target.id == 'two') { 

    //Perform jQuery .animate function 

} 

if (e.target.id == 'three') { 

//Perform jQuery .animate function 

} 

    //etc 

}); 

어떤 도움이나 조언 주시면 감사하겠습니다!

답변

3

예제에서 pagecreate 이벤트는 처음 페이지를 만들 때 한 번만 트리거됩니다.

그래서 다음과 같이 pagebeforeshow 이벤트로 변경 :

$(document).bind('pagebeforeshow', function (e) { 

을 항상 사용 pagebeforeshow 사용하는 어떤 페이지 이벤트 모르는 경우.

페이지 이벤트에 대한 자세한 내용을 알아 보려면 어떻게 그들은이 ARTICLE에서 살펴하거나 HERE을 찾을 작동합니다.

$(document).on('pagebeforeshow', '#page-id', function (e) { 
: 특정 페이지를 대상으로 할 경우

$(document).on('pagebeforeshow', '[data-role="page"]', function (e) { 

또는 :

한 가지 더, 이것은 deprectaed되는 오류 만 bind(.. 아니라, 바인딩 이벤트에 대한 on(...로 전환

+0

완벽! 그 점에 대해 대단히 고마워. 그리고 여분의 정보를 가져 주셔서 감사합니다 - 나는 바인드가 감가 상각되었다는 것을 확실히 알지 못했습니다. –

관련 문제