jQuery Mobile página de eventos
Eventos para lidar com páginas em jQuery Mobile estão divididos em quatro categorias:
- Inicialização página - Antes de criação de página, e quando a página foi criada
- Carga Página / Unload - Quando uma página externa é carga ou descarga e encontra uma falha
- Página de Transição - Antes e depois de transições de página
- Página Mudança - Quando as páginas são alteradas para ou a partir de, ou encontrar uma falha
Para uma referência completa de todos os eventos jQuery Mobile, por favor, vá ao nosso jQuery Mobile Eventos de Referência .
jQuery Mobile Inicialização Eventos
Quando uma página típica de jQuery Mobile é inicializado, ele passa por duas etapas:
- Antes de criação de página
- criação de páginas
Cada fase tem um evento que pode ser usado para inserir ou manipular código antes ou quando jQuery Mobile aumenta a página.
| Evento | Descrição |
|---|---|
| pagebeforecreate | Acionado quando a página está prestes a ser inicializado, e antes jQuery Mobile começou a melhorar a página |
| pagecreate | Acionado quando a página foi criada, mas antes de realce é completa |
O exemplo abaixo demonstra quando cada evento é acionado quando uma página é criada no jQuery Mobile:
Exemplo
$(document).on("pagebeforecreate",function(event){
alert("pagebeforecreate event fired!");
});
$(document).on("pagecreate",function(event){
alert("pagecreate event fired!");
}); Tente você mesmo " jQuery Mobile Carga Eventos
eventos de carregamento de página são para páginas externas.
Sempre que uma página externa é carregado no DOM, 2 eventos disparar. O primeiro é pagecontainerbeforeload, ea segunda será ou pagecontainerload (êxito) ou pagecontainerloadfailed (falha).
Estes eventos são explicados na tabela seguinte:
| Evento | Descrição |
|---|---|
| pagecontainerbeforeload | Desencadeado antes de qualquer pedido de carregamento da página é feita |
| pagecontainerload | Desencadeado após a página ter sido carregado com êxito e inserido no DOM |
| pagecontainerloadfailed | Acionado se o pedido de carregamento da página falha. Por padrão, ele irá mostrar a mensagem "Erro ao carregar página" |
O exemplo abaixo demonstra como o pagecontainerload e eventos pagecontainerloadfailed trabalhar:
Exemplo
$(document).on("pagecontainerload",function(event,data){
alert("pageload
event fired!\nURL: " + data.url);
});
$(document).on("pagecontainerloadfailed",function(event,data){
alert("Sorry, requested page does not exist.");
}); Tente você mesmo " jQuery Mobile transição Eventos
Também pode usar eventos para quando nós fazemos a transição de uma página para a próxima.
Transições de página envolvem duas páginas: a "de" página e um "a" página - essas transições animam a mudança da actual página activa (fromPage) para uma nova página (toPage) .
| Evento | Descrição |
|---|---|
| pagebeforeshow | Disparado no "a" da página, antes de a animação de transição começa |
| pageshow | Disparado no "a" página, após a animação de transição completa |
| pagebeforehide | Desencadeada na página "de", antes de a animação de transição começa |
| pagehide | Desencadeada na página "de", após a animação de transição completa |
O exemplo abaixo demonstra como os eventos de transição trabalhar:
Exemplo
$(document).on("pagebeforeshow","#pagetwo",function(){ // When entering
pagetwo
alert("pagetwo is about to be shown");
});
$(document).on("pageshow","#pagetwo",function(){
// When entering pagetwo
alert("pagetwo is now shown");
});
$(document).on("pagebeforehide","#pagetwo",function(){
// When leaving pagetwo
alert("pagetwo is about to be hidden");
});
$(document).on("pagehide","#pagetwo",function(){
// When leaving pagetwo
alert("pagetwo is now hidden");
}); Tente você mesmo "