Closing jQuery Mobile Panel

javascript, jquery, jquery-mobile

Solution

You do something like this

$(document).on("pageinit", function () {
  $("[data-role=panel] a").on("click", function () {
    if($(this).attr("href") == "#"+$.mobile.activePage[0].id) {
      $("[data-role=panel]").panel("close");
    }
  });
});

Update: For jQM >= 1.4 use `$.mobile.pageContainer.pagecontainer("getActivePage")` instead of `$.mobile.activePage`.

Demo: http://jsfiddle.net/Palestinian/k89A5/1/

Problem

I have a panel with links like this Page1 Page2 Page3 If I am currently on Page1 and open the panel, the panel is not closed when I select Page1 again. I have checked jQuery mobile panel documentation, and has the same behaviour (if you open the panel an click on "Panels", the panel will stay open. Is there a way to close the panel if same page link is selected? Edit: jQuery Mobile version: 1.3.2 jQuery version: 1.9.1

Original source