Latest web development tutorials

jQuery를 모바일 페이지 이벤트

jQuery를 모바일 페이지 이벤트

처리 jQuery를 모바일 페이지에서 이벤트는 네 가지 범주로 구분됩니다

  • 초기화 페이지 - 페이지는 페이지가 생성 될 때 생성하고 페이지 초기화 후에 전
  • 페이지로드 / 언로드 - 외부 페이지 로딩, 언 로딩하거나 첫 번째 실패 할 때
  • 페이지 전환 - 전후 페이지 전환
  • 페이지가 변경 될 때, 또는 얼굴 실패 - 페이지 변경

모든 이벤트 jQuery를 모바일에 대한 자세한 내용은, 우리의 방문하시기 바랍니다 jQuery를 모바일 이벤트 매뉴얼 .

jQuery를 모바일 초기화 이벤트

jQuery를 모바일 전형적인 페이지에서 초기화 될 때, 세 단계를 통해 이동한다 :

  • 페이지 생성 전
  • 페이지 생성
  • 페이지 초기화

이벤트 트리거는 연산 코드 또는 인서트의 각 단계에서 사용될 수있다.

행사 기술
pagebeforecreate 때 페이지가 초기화에 대한, 그리고 jQuery를 모바일 향상된 페이지 전에 이벤트를 트리거하기 시작했다.
pagecreate 페이지가 작성되면하지만 개선의 완료 전에 이벤트 트리거.
pageinit 페이지가 초기화되면 jQuery를 모바일 향상된 페이지가 완료된 후와 상기 이벤트를 트리거.

이 때 각각의 이벤트를 트리거하는 페이지를 만들 때 다음 예제는 jQuery를 모바일을 보여줍니다

예

$ (문서) CSTE 연구진 ( "pagebeforecreate", 기능 (이벤트) {
경보 ( "pagebeforecreate 이벤트 트리거!");
});
$ (문서) CSTE 연구진 ( "pagecreate", 기능 (이벤트) {
경보 ( "pagecreate 이벤트 트리거!");
});

»시도

jQuery를 모바일 Load 이벤트

페이지로드 이벤트는 외부 페이지에 속한다.

때마다 외부 페이지 로딩 DOM, 두 개의 이벤트가 트리거됩니다. 첫번째는 pagebeforeload이며, 두 번째 pageload (성공) 또는 pageloadfailed (불량)이다.

다음 표는 이러한 이벤트를 설명합니다 :

행사 기술
pagebeforeload 트리거를 로딩 페이지에 대한 요청에 앞서.
pageload 페이지가 성공적으로로드이었고, DOM 트리거 삽입.
pageloadfailed 페이지로드 요청이 실패하는 경우, 이벤트가 트리거된다. 기본적으로, "오류로드 페이지"메시지가 표시됩니다.

다음 프리젠 테이션 pageload 및 pagloadfailed 이벤트가 작동합니다 :

예

$(document).on("pageload",function(event,data){
  alert("触发 pageload 事件！\nURL: " + data.url);
});
$(document).on("pageloadfailed",function(event,data){
  alert(";抱歉，被请求页面不存在。");
});

»시도

jQuery를 모바일 전환 이벤트

우리는 하나에서 다음에 전환하는 동안 이벤트를 사용할 수 있습니다.

두 페이지와 관련된 페이지 전환하십시오 "를"페이지에 "이동"페이지 - 이러한 전환은 새 페이지 현재 활성 페이지 ( "을"페이지를) 확인 (물론 페이지하게 변경 "로 이동" 보다 역동적.

행사 기술
pagebeforeshow 전환 애니메이션이 시작되기 전에 트리거 "이동"페이지에서.
pageshow 은 "이동"화면 트리거 전이 애니메이션의 종료 후에.
pagebeforehide 은 "을"트리거 페이지에서 이전에 전환 애니메이션이 시작됩니다.
pagehide "수신"화면 트리거 전이 애니메이션의 종료 후에.

다음은 전이 시간의 원리를 예시한다 :

예

$(document).on("pagebeforeshow","#pagetwo",function(){ //当进入页面二时
  alert("页面二即将显示");
});
$(document).on("pageshow","#pagetwo",function(){ // 当进入页面二时
  alert("现在显示页面二");
});
$(document).on("pagebeforehide","#pagetwo",function(){ // 当进入页面二时
  alert("页面二即将隐藏");
});
$(document).on("pagehide","#pagetwo",function(){ // When leaving pagetwo
  alert("现在隐藏页面二");
});

»시도