Search code examples
javascriptjqueryjquery-mobilejquery-events

jQuery Mobile linked list pageInit(), not $(document).ready()


I'm trying to make a mobile version of a web page. My problem is that I have to manipulate a accordion menu to use jQuery mobile linked list. To do this I manipulate the menu with jQuery ex:

$(document).ready(function() {
    $('#globalMenu').attr("data-role", "listview");
    .. .. . . ..
});

It works great if I load the page first time, but when I navigate in the jQuery mobile list and push one of the link the script do not run, but if I refresh the page (f5) it works! I've read that I have to use init instead of document ready but I can't manage it to work.

Please write some examples.

jQueryMobile event page


Solution

  • Supposing your page div is like this:

    <div id="my-page" data-role="page">
    

    Try with:

    $('#my-page').live('pageinit', function(event){
      $('#globalMenu').attr("data-role", "listview");
    });