Latest web development tutorials
 

jQuery pagecontainerload Event

< jQuery Mobile Events

Example

Alert some text when the external page has been successfully loaded and inserted into the DOM:

$(document).on("pagecontainerload",function(){
  alert("pagecontainerload event fired!");
});
Try it Yourself »

Definition and Usage

The pagecontainerload event is triggered after the page has been successfully loaded and inserted into the DOM.

Related events:

Note: These events are used for external pages - Whenever an external page is loaded into the DOM, 2 events are fired. The first is pagecontainerbeforeload. The 2nd event will either be pagecontainerload or pagecontainerloadfailed.

Syntax

$("document").on("pagecontainerload",function(event,data){...})

Parameter Description
function(event,data) Required. Specifies the function to run when the pagecontainerload event occurs.

The function has two optional parameters:

The event object - which can contain any jQuery event properties (e.g. event.target, event.type, etc.) See jQuery Events Reference for more information

The data object - contains the following:

  • url (string) - contains the absolute or relative URL of the page (that was sent to $.mobile.loadPage())
  • absUrl (string) - contains the absolute reference of the URL
  • dataUrl (string) - contains the URL of the browser's location
  • options (object) - contains the options that were sent to $.mobile.loadPage()
  • xhr (object) - contains the XMLHttpRequest object (Sent as the 3rd argument to $.ajax() success callback)
  • textStatus (string or null) - contains the status of the request ("success" or "null") (Sent as the 2nd argument to $.ajax() error callback)

Try it Yourself - Examples

A demonstration of related events
A demonstration of pagecontainerload and pagecontainerloadfailed.

The event object
Using the event.type property to return the triggered event type.

The data object
Using data.url to return the URL of the external page.

< jQuery Mobile Events