CODEWITHSUNDEEP
jquery-mobile
Oli
Oli

Reputation: 239820

jQuery Mobile - Do something on page load

I want to do something every time a page loads. It's something that fixes the way the mobile site looks on different devices so it needs to happen on AJAX loads too.

At the moment, I've tried the traditional $(function(){ /*...*/ }); approach but that only works on the first load, and not subsequent AJAX loads.

I've been looking for the right event to bind to but I'm failing pretty hard.

Upvotes: 12

Views: 33935

Answers (2)

Jasper
Jasper

Reputation: 75993

You can use JQuery to bind to each "page" (div's set with the data-role=page attribute) and use the pageshow event (there are some others as well: pagebeforeshow, pagehide, pagebeforehide).

$(document).delegate('.ui-page', 'pageshow', function () {
    //Your code for each page load here
});

http://api.jquerymobile.com/pageshow/

Note: this answer was written for jQuery Mobile 1.0.1, see the documentation link above for more information.

Upvotes: 27

J.T.Sage
J.T.Sage

Reputation: 1984

You can listen to the pageshow or pagecreate event and do your work there.

http://jquerymobile.com/test/docs/api/events.html

Upvotes: 5

Related Questions