본문 바로가기

jquery mobile30

크로스 도메인 통신 JavaScript 코드는 자신이 로드된 도메인만 통신이 가능하다. 즉, 크로스 도메인과는 통신할 수 없다. 이러한 규칙은 AJAX 통신에서도 동일하게 적용된다. 이러한 규칙은 여러가지 Open API에 접근해서 클라이언트 매시업 기능을 필요료 하는 웹앱에서는 문제가 된다. 또한, 웹앱을 네이티브앱으로 전환하는 경우 모바일 기기의 로컬에서 외부 서버에 액세스를 할 수가 없다. 이런 이유로 jQuery Mobile 웹앱이 네이트브앱으로 전환되면 모든 통신이 동작하지 않는다(jQuery Mobile은 모든 통신이 AJAX에 의해서 이루어 진다). 두가지 문제점을 jQuery Mobile에서 해결할 수 있는 방법은 다음과 같다. jQuery Mobile 웹앱에서 Open API 데이터 이용 jQuery Mob.. 2014. 1. 6.
30. jQuery Mobile, AJAX 통신 Index 28. 페이지 트랜지션 이벤트 29. 페이지 초기화 이벤트 30. jQuery Mobile, AJAX 통신 jQuery Mobile은 첫(홈) 페이지는 서버에서 풀브라우징으로 실행한다. 그 이후 부터 다른 페이지에 대한 요청은 jQuery Mobile이 내부적으로 AJAX통신으로 처리해 DOM객체에 추가해 준다. 개발자는 AJAX를 위한 코드를 작성할 필요없이 가져오고자 하는 결과물에 해당하는 HTML만 작성하면 된다. 다음은 응답페이지에 대한 기본 형태이다. //페이지 내용 [영어회화] Be my guest. 사양하지 마세요 2014. 1. 5.
29. 페이지 초기화 이벤트 Index 27. 페이지 이동 전에 발생하는 pageremove 이벤트 28. 페이지 트랜지션 이벤트 29. 페이지 초기화 이벤트 30. jQuery Mobile, AJAX 통신 jQuery Mobile은 웹앱에서 페이지를 초기화 할 수 있도록 초기화 이벤트를 제공한다. 초기화 이벤트는 pagebeforecreate, pagecreate, pageinit 가 있으면 3개 이벤트는 페이지 로드 이벤트인 pagebeforeload 와 pageload 사이에 순차적으로 발생한다. 이벤트 핸들러 바인딩 $(document).bind("mobileinit", function(){ $("외부 페이지 아이디").live("pagebeforecreate", function(event){ } $("외부 페이지 아이디").. 2014. 1. 3.
28. 페이지 트랜지션 이벤트 Index 26. 페이지 로드 이벤트 27. 페이지 이동 전에 발생하는 pageremove 이벤트 28. 페이지 트랜지션 이벤트 29. 페이지 초기화 이벤트 30. jQuery Mobile, AJAX 통신 페이지 트랜지션 이벤트는 페이지 이동시에 발생한다. 발생하는 이벤트로는 pagebeforehide, pagehide, pagebeforeshow, pageshow 이벤트가 있다. 페이지가 사라질 때 pagebeforehide, pagehide 이벤트가 발생하고 새로운 페이지가 나타날때 pagebeforeshow, pageshow 이벤트가 발생한다. $(document).bind("mobileinit", function(){ $("#페이지아이디").live("pagebeforeshow", function.. 2014. 1. 2.
27. 페이지 이동 전에 발생하는 pageremove 이벤트 Index 25. mobileinit 이벤트 26. 페이지 로드 이벤트 27. 페이지 이동 전에 발생하는 pageremove 이벤트 28. 페이지 트랜지션 이벤트 29. 페이지 초기화 이벤트 jQuery Mobile 은 DOM에 추가된 외부 페이지에서 다른 페이지로 이동 시에 해당 페이지를 DOM에서 제거한다. 이 때, 페이지가 DOM에서 제거되기 직전에 pageremove 이벤트가 발생한다. 주로 해당 페이지가 제거되기 전에 가지고 있는 값을 보존하기 위해서 사용된다. $(document).bind("mobileinit", function(){ $("#페이지아이디").live("pageremove", function(event"{ //페이지 이동 전에 처리하고자 하는 내용 }); }); [영어회화] O.. 2014. 1. 1.
26. 페이지 로드 이벤트 Index 24. flip toggle 양식 25. mobileinit 이벤트 26. 페이지 로드 이벤트 27. 페이지 이동 전에 발생하는 pageremove 이벤트 28. 페이지 트랜지션 이벤트 페이지 로드 이벤트는 웹앱 DOM에 외부 페이지가 통합될 때 발생한다. 이벤트 발생 순서는 다음과 같다. pagebeforeload : 외부 페이지가 통합되기 직전에 발생 pageload : 웹앱 DOM에 외부 페이지 통합이 완료되면 발생 pageloadfailed : 통합에 실패하면 발생 (서버 접속 에러 또는 서버 실행 에러시 발생) 페이지 핸들러 등록 $(document).bind("mobileinit", function(){ $(document).bind("pagebeforeload", function(.. 2013. 12. 30.
25. mobileinit 이벤트 Index 23. checkbox, radio 버튼 양식 24. flip toggle 양식 25. mobileinit 이벤트 26. 페이지 로드 이벤트 27. 페이지 이동 전에 발생하는 pageremove 이벤트 mobileinit 이벤트는 웹앱이 시작되자마자 발새하는 이벤트로 jQuery Mobile 라이브러리가 로딩되자마자 발생한다. 따라서, mobileinit 이벤트 핸들러는 jQuery Mobile 라이브러리가 로딩되기 전에 바인딩 되어야 한다. mobileinit 이벤트 핸들러에서는 주로 jQuery Mobile의 기본 설정 값을 변경할 때 사용된다. jQuery Mobile의 주요 기본 설정 내용은 다음과 같다. 기본 설정 내용 설명 값 defaultPageTransition 페이지 트랜지션 .. 2013. 12. 29.