简体   繁体   中英

Is it possible to set active panel of Jquery Accordion dynamically while calling?

I have a situation where I am calling a greybox popup window with Jquery Acoridon from main page with links and would like to know if it is possible to set default active panel for acordion while calling it.

Here is sample:

In my main page this is the HTML:

<a href="example.php" id="1" onclick="return parent.GB_showCenter('Example.', this.href, 400, 600)" target="_blank">
Panel 1
</a>

<a href="example.php" id="2" onclick="return parent.GB_showCenter('Example.', this.href, 400, 600)" target="_blank">
Panel 2
</a>

<a href="example.php" id="3" onclick="return parent.GB_showCenter('Example.', this.href, 400, 600)" target="_blank">
Panel 3
</a>

Here is the Javascript on example.php:

$(function() {
  $( "#acordion" ).accordion({ active: 0, collapsible: true, autoHeight: false });

This is html part of example.php

<div id="acordion">
  <h3><a href="#">Panel 0</a></h3>
  <div>Do something @ Panel 1</div>

  <h3><a href="#">Panel 1</a></h3>
  <div>Do something @ Panel 2</div>

  <h3><a href="#">Panel 2</a></h3>
  <div>Do something @ Panel 3</div>

</div>

I set panel 0 as default active panel and this opens panel 0 as active panel whenever I open that page. Just want to set panel 1 or panel 2 as active panel while opening with link 2 or link 3.

You need to pass default panel value to the page, eg in hash part of url:

<a href="example.php#1" id="1" onclick="return parent.GB_showCenter('Example.', this.href, 400, 600)" target="_blank">
Panel 1
</a>

Then just read it with javascript: document.location.hash , and use as default value for your accordion.

$(function() {
   var hash = document.location.hash;
   $( "#acordion" ).accordion({ active: hash, collapsible: true, autoHeight: false });
});

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM