jQuery Mobile ਪੇਜ਼ ਈਵੈਂਟ

jQuery Mobile ਪੇਜ਼ ਈਵੈਂਟ

jQuery Mobile ਵਿੱਚ ਪੇਜਜ਼ ਨਾਲ ਸੰਬੰਧਿਤ ਈਵੈਂਟਾਂ ਨੂੰ ਚਾਰ ਵਰਗਾਂ ਵਿੱਚ ਵੰਡਿਆ ਜਾਂਦਾ ਹੈ:

  • ਪੇਜਜ਼ ਇਨੀਸੀਏਰੇਸ਼ਨ - ਪੇਜਜ਼ ਬਣਾਉਣ ਤੋਂ ਪਹਿਲਾਂ, ਜਦੋਂ ਪੇਜਜ਼ ਬਣਾਇਆ ਜਾਂਦਾ ਹੈ, ਅਤੇ ਜਦੋਂ ਪੇਜਜ਼ ਇਨੀਸੀਏਰੇਸ਼ਨ ਕੀਤੀ ਜਾਂਦੀ ਹੈ
  • ਪੇਜਜ਼ ਲੋਡ/ਅਲੌਡ - ਜਦੋਂ ਬਾਹਰੀ ਪੇਜਜ਼ ਲੋਡ ਕੀਤਾ ਜਾਂਦਾ ਹੈ, ਅਲੌਡ ਕੀਤਾ ਜਾਂਦਾ ਹੈ ਜਾਂ ਫੇਲੇ ਜਾਂਦਾ ਹੈ
  • ਪੇਜਜ਼ ਟ੍ਰਾਂਸੀਸ਼ਨ - ਪੇਜਜ਼ ਟ੍ਰਾਂਸੀਸ਼ਨ ਤੋਂ ਪਹਿਲਾਂ ਅਤੇ ਬਾਅਦ
  • ਪੇਜਜ਼ ਚੇਂਜ - ਜਦੋਂ ਪੇਜਜ਼ ਬਦਲਿਆ ਜਾਂ ਫੇਲੇ ਜਾਂਦਾ ਹੈ

ਸਾਰੇ jQuery Mobile ਈਵੈਂਟਾਂ ਦੀ ਪੂਰੀ ਜਾਣਕਾਰੀ ਲਈ, ਅਸੀਂ ਦੀ ਸੂਚਨਾ ਸਾਈਟ ਦੇ ਯਾਤਰਾ ਕਰੋ: jQuery Mobile ਈਵੈਂਟ ਰੈਫਰੈਂਸ ਮੈਨੂਅਲ。

jQuery Mobile ਇਨੀਸੀਏਰੇਸ਼ਨ ਈਵੈਂਟ

ਜਦੋਂ jQuery Mobile ਵਿੱਚ ਇੱਕ ਤਰੀਕੇ ਦਾ ਪੇਜਜ਼ ਇਨੀਸੀਏਰੇਸ਼ਨ ਕੀਤਾ ਜਾ ਰਿਹਾ ਹੈ, ਤਾਂ ਇਹ ਤਿੰਨ ਪੜਾਵਾਂ ਦੇ ਅਨੁਭਵ ਕਰਦਾ ਹੈ:

  • ਪੇਜਜ਼ ਬਣਾਉਣ ਤੋਂ ਪਹਿਲਾਂ
  • ਪੇਜਜ਼ ਬਣਾਇਆ
  • ਪੇਜ਼ ਇਨੀਸੀਏਰੇਸ਼ਨ

ਹਰੇਕ ਪੜਾਵ ਵਿੱਚ ਟ੍ਰਿਗਰ ਹੋਣ ਵਾਲਾ ਈਵੈਂਟ ਕੋਡ ਜੋੜਨ ਜਾਂ ਟ੍ਰਾਂਸਫਾਰਮ ਕਰਨ ਲਈ ਵਰਤਿਆ ਜਾ ਸਕਦਾ ਹੈ。

ਈਵੈਂਟ ਵਰਣਨ
pagebeforecreate ਜਦੋਂ ਪੇਜ਼ ਪਹਿਲੀ ਵਾਰ ਚਲਾਇਆ ਜਾ ਰਿਹਾ ਹੈ, ਅਤੇ jQuery Mobile ਪੇਜ਼ ਨੂੰ ਇੰਸਟ੍ਰੂਮੈਂਟ ਕਰਨ ਤੋਂ ਪਹਿਲਾਂ, ਇਹ ਈਵੈਂਟ ਟ੍ਰਿਗਰ ਹੁੰਦਾ ਹੈ。
pagecreate ਜਦੋਂ ਪੇਜ਼ ਬਣਾਇਆ ਹੋਇਆ ਹੈ, ਪਰ ਇਸਦਾ ਪ੍ਰਸਾਰਣ ਪੂਰਾ ਹੋਣ ਤੋਂ ਪਹਿਲਾਂ, ਇਹ ਈਵੈਂਟ ਟ੍ਰਿਗਰ ਹੁੰਦਾ ਹੈ。
pageinit ਜਦੋਂ ਪੰਨਾ ਇਨੈਟੀਅਲਾਈਜ਼ ਹੋ ਜਾਵੇ ਅਤੇ jQuery Mobile ਪੰਨੇ ਮਜ਼ਬੂਤੀ ਕਰਨ ਦੇ ਬਾਅਦ ਇਹ ਈਵੈਂਟ ਟ੍ਰਿਗਰ ਕੀਤਾ ਜਾਂਦਾ ਹੈ。

ਹੇਠ ਦੇ ਉਦਾਹਰਣ ਵਿੱਚ jQuery Mobile ਵਿੱਚ ਪੰਨੇ ਬਣਾਉਣ ਦੇ ਸਮੇਂ ਹਰ ਈਵੈਂਟ ਨੂੰ ਟ੍ਰਿਗਰ ਕਰਨ ਦਾ ਪ੍ਰਯੋਗ ਦਿਖਾਇਆ ਗਿਆ ਹੈ:

ਮਿਸਾਲ

$(document).on("pagebeforecreate",function(event){
  alert(\"pagebeforecreate ਈਵੈਂਟ ਟ੍ਰਿਗਰ ਕੀਤਾ ਗਿਆ!");
}); 
$(document).on("pagecreate",function(event){
  alert(\"pagecreate ਈਵੈਂਟ ਟ੍ਰਿਗਰ ਕੀਤਾ ਗਿਆ!");
});
$(document).on("pageinit",function(event){
  alert(\"pageinit ਈਵੈਂਟ ਟ੍ਰਿਗਰ ਕੀਤਾ ਗਿਆ!");
});

ਆਪਣੇ ਅਨੁਸਾਰ ਪ੍ਰਯੋਗ ਕਰੋ

jQuery Mobile Load ਈਵੈਂਟ

ਪੰਨੇ ਲੋਡ ਈਵੈਂਟ ਬਾਹਰੀ ਪੰਨੇ ਨਾਲ ਸਬੰਧਤ ਹਨ。

ਕਿਸੇ ਬਾਹਰੀ ਪੰਨੇ ਦੇ DOM ਲੋਡ ਹੋਣ ਤੋਂ ਬਾਅਦ, ਦੋ ਈਵੈਂਟ ਟ੍ਰਿਗਰ ਕੀਤੇ ਜਾਂਦੇ ਹਨ। ਪਹਿਲਾ ਈਵੈਂਟ ਹੈ pagebeforeload ਅਤੇ ਦੂਜਾ ਪਹਿਲਾ ਈਵੈਂਟ ਹੈ pageload (ਸਫਲ) ਜਾਂ pageloadfailed (ਫੇਲੀ)

ਹੇਠ ਦੇ ਤਾਲਿਕੇ ਵਿੱਚ ਇਹ ਈਵੈਂਟ ਵਿਸਥਾਰਿਤ ਕੀਤੇ ਗਏ ਹਨ:

ਈਵੈਂਟ ਵਰਣਨ
pagebeforeload ਕਿਸੇ ਪੰਨੇ ਲੋਡ ਕਰਨ ਦੀ ਬੇਨਤੀ ਪਹਿਲਾਂ ਟ੍ਰਿਗਰ ਕੀਤਾ ਜਾਂਦਾ ਹੈ。
pageload ਪੰਨਾ ਸਫਲਤਾ ਨਾਲ ਲੋਡ ਹੋਣ ਅਤੇ DOM ਵਿੱਚ ਜੋੜਿਆ ਜਾਣ ਤੋਂ ਬਾਅਦ ਟ੍ਰਿਗਰ ਕੀਤਾ ਜਾਂਦਾ ਹੈ。
pageloadfailed ਜੇਕਰ ਪੰਨੇ ਲੋਡ ਕਰਨ ਦੀ ਬੇਨਤੀ ਫੇਲੀ ਤਾਂ ਇਹ ਈਵੈਂਟ ਟ੍ਰਿਗਰ ਕੀਤਾ ਜਾਂਦਾ ਹੈ। ਮੂਲਤਬੀ, "Error Loading Page" ਸੁਨੇਹਾ ਦਿਖਾਈ ਜਾਵੇਗੀ。

ਨਿਮਨ ਵਿੱਚ pageload ਅਤੇ pageloadfailed ਈਵੈਂਟ ਦੇ ਕੰਮ ਕਰਨ ਦੇ ਮੁੱਢਲੇ ਪ੍ਰਯੋਗ ਦਿਖਾਇਆ ਗਿਆ ਹੈ:

ਮਿਸਾਲ

$(document).on("pageload",function(event,data){
  alert(\"pageload ਈਵੈਂਟ ਟ੍ਰਿਗਰ ਕੀਤਾ ਗਿਆ!\nURL: " + data.url);
});
$(document).on("pageloadfailed",function(event,data){
  alert(\"ਮਾਫ ਕਰੋ, ਬੇਨਤੀ ਕੀਤੇ ਗਏ ਪੰਨੇ ਨਹੀਂ ਮੌਜੂਦ\");
});

ਆਪਣੇ ਅਨੁਸਾਰ ਪ੍ਰਯੋਗ ਕਰੋ

jQuery Mobile ਟ੍ਰਾਂਜਿਸ਼ਨ ਈਵੈਂਟ

ਅਸੀਂ ਇਵੈਂਟ ਦਾ ਉਪਯੋਗ ਪੰਨੇ ਤੋਂ ਪੰਨੇ ਤੇ ਟ੍ਰਾਂਜਿਸ਼ਨ ਕਰਦੇ ਸਮੇਂ ਕਰ ਸਕਦੇ ਹਾਂ。

ਪੰਨੇ ਤੋਂ ਟ੍ਰਾਂਜਿਸ਼ਨ ਇਵੈਂਟ ਦੋ ਪੰਨੇ ਸ਼ਾਮਲ ਹੁੰਦੇ ਹਨ: ਇੱਕ ‘ਆਉਣ ਵਾਲਾ’ ਪੰਨਾ ਅਤੇ ਇੱਕ ‘ਜਾਣ ਵਾਲਾ’ ਪੰਨਾ - ਇਹ ਟ੍ਰਾਂਜਿਸ਼ਨ ਇਵੈਂਟ ਮੌਜੂਦਾ ਗਤੀਸ਼ੀਲ ਪੰਨੇ (‘ਆਉਣ ਵਾਲਾ’ ਪੰਨਾ) ਨੂੰ ਨਵੇਂ ਪੰਨੇ (‘ਜਾਣ ਵਾਲਾ’ ਪੰਨਾ) ਤੱਕ ਬਦਲਣ ਦੀ ਪ੍ਰਕਿਰਿਆ ਨੂੰ ਹੋਰ ਗਤੀਸ਼ੀਲ ਬਣਾਉਂਦੇ ਹਨ。

ਈਵੈਂਟ ਵਰਣਨ
pagebeforeshow “ਜਾਣ ਵਾਲੇ” ਪੰਨੇ ਤੇ ਟ੍ਰਿਗਰ ਕੀਤਾ ਜਾਂਦਾ ਹੈ, ਟ੍ਰਾਂਜਿਸ਼ਨ ਐਨੀਮੇਸ਼ਨ ਸ਼ੁਰੂ ਹੋਣ ਤੋਂ ਪਹਿਲਾਂ。
pageshow “ਜਾਣ ਵਾਲੇ” ਪੰਨੇ ਤੇ ਟ੍ਰਿਗਰ ਕੀਤਾ ਜਾਂਦਾ ਹੈ, ਟ੍ਰਾਂਜਿਸ਼ਨ ਐਨੀਮੇਸ਼ਨ ਪੂਰੀ ਹੋਣ ਤੋਂ ਬਾਅਦ。
pagebeforehide “ਆਉਣ ਵਾਲੇ” ਪੰਨੇ ਤੇ ਟ੍ਰਿਗਰ ਕੀਤਾ ਜਾਂਦਾ ਹੈ, ਟ੍ਰਾਂਜਿਸ਼ਨ ਐਨੀਮੇਸ਼ਨ ਸ਼ੁਰੂ ਹੋਣ ਤੋਂ ਪਹਿਲਾਂ。
pagehide “ਆਉਣ ਵਾਲੇ” ਪੰਨੇ ਤੇ ਟ੍ਰਾਂਜਿਸ਼ਨ ਐਨੀਮੇਸ਼ਨ ਪੂਰੀ ਹੋਣ ਤੋਂ ਬਾਅਦ ਟ੍ਰਿਗਰ ਕੀਤਾ ਜਾਂਦਾ ਹੈ。

ਨਿਮਨ ਵਿੱਚ ਟ੍ਰਾਂਜਿਸ਼ਨ ਸਮੇਂ ਦੇ ਕੰਮ ਕਰਨ ਦੇ ਮੁੱਢਲੇ ਪ੍ਰਯੋਗ ਦਿਖਾਇਆ ਗਿਆ ਹੈ:

ਮਿਸਾਲ

$(document).on(\"pagebeforeshow\","#pagetwo",function(){ // ਜਦੋਂ ਪੇਜ ਦੂਜਾ ਦਿਖਾਉਣ ਦੇ ਸਮੇਂ
  alert(\"页面二即将显示\
});
$(document).on("pageshow","#pagetwo",function(){ // ਜਦੋਂ ਪੇਜ ਦੂਜਾ ਦਿਖਾਉਣ ਦੇ ਸਮੇਂ
  alert("ਹੁਣ ਪੇਜ ਦੂਜਾ ਦਿਖਾਉਣਾ ਹੈ");
});
$(document).on("pagebeforehide","#pagetwo",function(){ // ਜਦੋਂ ਪੇਜ ਦੂਜਾ ਛੁਪਾਉਣ ਦੇ ਸਮੇਂ
  
});
$(document).on("pagehide","#pagetwo",function(){ // ਜਦੋਂ ਪੇਜ ਦੂਜਾ ਛੁਪਾਉਣ ਦੇ ਸਮੇਂ
  alert("ਹੁਣ ਪੇਜ ਦੂਜਾ ਛੁਪਾਉਣਾ ਹੈ");
});

ਆਪਣੇ ਅਨੁਸਾਰ ਪ੍ਰਯੋਗ ਕਰੋ