jQuery Mobile - 앱에서 뒤로 (하드웨어) 버튼이 작동하지 않습니다.

저는 jQmobile을 처음 사용하고 jqMobile 사이트의 예제를 따라 왔습니다. 멀티 페이지 템플릿 형식을 사용하여 뒤로 버튼을 작동 시키려고합니다 (하드웨어 버튼). 그러나 두 번째 페이지에서 (하드웨어) 뒤로 버튼을 누르면 첫 페이지로 돌아가는 대신 응용 프로그램이 종료됩니다. 여기에 내가 사용하고있는 샘플 코드는 다음과 같습니다jQuery Mobile - 앱에서 뒤로 (하드웨어) 버튼이 작동하지 않습니다.

<head> 
<title>PhoneGap</title> 
<script type="text/javascript" charset="utf-8" src="phonegap-1.2.0.js"></script> 
<meta name="viewport" content="width=device-width,height=device-height,initial-scale=1"> 

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" /> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script> 

<script type="text/javascript"> 
//This is your app's init method. Here's an example of how to use it 
function init() { 

    document.addEventListener("deviceready", onDR, false); 

} 

function onDR(){ 
    //document.addEventListener("backbutton", backKeyDown, true); 
    navigator.notification.alert("PhoneGap is working"); 
    //boot your app... 

} 

function backKeyDown() { 

    // do something here if you wish  
} 



$(document).bind("mobileinit", function(){ 
    $.mobile.touchOverflowEnabled = true; 
    $.mobile.defaultPageTransition = 'fade'; 
}); 



</script> 
<script type="text/javascript" src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script> 
</head>

<!-- Start of first page --> 
<div data-role="page" id="foo"> 

    <div data-role="header"> 
     <h1>Foo</h1> 
    </div><!-- /header --> 

    <div data-role="content"> 
     <p>I'm first in the source order so I'm shown as the page.</p>  
     <p>View internal page called <a href="#bar">bar</a></p> 
    </div><!-- /content --> 

    <div data-role="footer"> 
     <h4>Page Footer</h4> 
    </div><!-- /footer --> 
</div><!-- /page --> 


<!-- Start of second page --> 
<div data-role="page" id="bar"> 

    <div data-role="header"> 
     <h1>Bar</h1> 
    </div><!-- /header --> 

    <div data-role="content"> 
     <p>I'm the second in the source order so I'm hidden when the page loads. I'm just shown if a link that references my ID is beeing clicked.</p>  
     <p><a href="#foo">Back to foo</a></p> 
    </div><!-- /content --> 

    <div data-role="footer"> 
     <h4>Page Footer</h4> 
    </div><!-- /footer --> 
</div><!-- /page --> 
</body>

감사, 사전에 모든 답변에 대해.

출처

2011-12-14 azsl1326

? 당신은 마크 업을 게시했습니다 ... – MilkyWayJoe

어떤 장치를 사용하고 있습니까 ? –

은하 SII뿐만 아니라 에뮬레이터에서 테스트되었습니다. 나는 OP에 javascript를 추가했다. – azsl1326

기기가 hashchange 이벤트를 지원하지 않을 수 있습니다.

당신은 해시 업데이트하는 데 사용되는 hashchange 이벤트와 장치의 호환성을 확인하실 수 있습니다

if ("onhashchange" in window) { 
    //... 
}

출처 : jQuery를 모바일 문서 도구에서 jQuery - hashchange event

을
사용자가 클릭과 같이 독립적으로 발생하는 해시 변경입니다 (예 : ). 뒤로 버튼은 hashchange 이벤트 을 통해 처리되며 Ben Alman의 hashchange 특별 이벤트 플러그인 (jQuery Mobile에 포함됨)을 사용하여 창 객체에 바인딩됩니다. 해시 변경 이 발생하면 첫 번째 페이지가로드 될 때 hashchange 이벤트 처리기가 location.hash를 $ .mobile.changePage() 함수로 보내고,이 함수는 참조 된 페이지를로드하거나 표시합니다.

출처 : 나는 ... 특별히 자바 스크립트로, 스마트 폰의 하드웨어 버튼의 동작을 변경하는 것이 가능하고 BTW .. 자바 스크립트가 어디라고 생각하지 않습니다 http://jquerymobile.com/test/docs/pages/page-navmodel.html

출처

2011-12-14 21:58:02 Jasper

과 자바 스크립트 코드를 추가했습니다. 나는 에뮬레이터와 내 갤럭시 SII 모두에서 테스트를 마쳤으며 뒤로 버튼은 내가 예상했던 방식대로 작동하지 않는 것 같습니다. – azsl1326

jQuery Mobile - 앱에서 뒤로 (하드웨어) 버튼이 작동하지 않습니다.

답변

관련 문제