Anjum Anjum - 6 months ago 59
Javascript Question

JQuery Mobile to check if a Div is Expanded or Collapsed

I have a Div that is collapsible using attribute

data-role="collapsible"


How can I check at any point in time whether the Div is in Collapsed mode or Expanded mode. I tried this but it doesn't work:

if ($("#hideshow").is(":collapsed"))
alert("collapsed");


Please note that
:visible
won't work because in both states visible returns true.

Answer

This is done via CSS. When a collapsible element is collapsed, it has the class "ui-collapsible-collapsed" added. Use .hasClass() to check it

if ($("#hideshow").hasClass('ui-collapsible-collapsed')) {
    alert("collapsed");
}