jQuery Mobile common footer for all pages

Question

I am using jQuery Mobile and in my project there are several pages .

I want that all pages to share a common footer without putting the footer in each page, I want it to be at only at one place and from there it will appear in all pages.

Is this possible?

Answer 1

Try this code:

$('[data-role=page]').on('pageshow', function (event, ui) {
            $("#" + event.target.id).find("[data-role=footer]").load("footer.html", function(){
                $("#" + event.target.id).find("[data-role=navbar]").navbar();
            });
        });

Refer to this post

Jquery Mobile Same Footer on Different Pages