如何在Spry选项卡式面板中打开FancyBox

时间:2013-08-07 06:21:19

标签: javascript jquery fancybox tabpanel spry

我正在使用Spry标签面板作为HTML基站。

我想通过单击选项卡(总共四个选项卡)打开fancybox。用户填写fancybox表单后,只应打开该特定选项卡面板内容。

这可能吗? 以下是我的代码。

    <div id="TabbedPanels1" class="TabbedPanels">
  <ul class="TabbedPanelsTabGroup">
    <li class="TabbedPanelsTab" tabindex="0">Tab 1</li>
    <li class="TabbedPanelsTab" tabindex="0">Tab 2</li>
     <li class="TabbedPanelsTab" tabindex="0">Tab 1</li>
    <li class="TabbedPanelsTab" tabindex="0">Tab 2</li>
  </ul>
  <div class="TabbedPanelsContentGroup">
    <div class="TabbedPanelsContent">Content 1</div>
    <div class="TabbedPanelsContent">Content 2</div>
     <div class="TabbedPanelsContent">Content 3</div>
    <div class="TabbedPanelsContent">Content 4</div>
  </div>
</div>
<script type="text/javascript">
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
</script>

我希望在精美的方框中填写第2页的表单。用户填写该表单并成功提交后,只应打开选项卡面板内容。

1 个答案:

答案 0 :(得分:1)

由于你还没有发布任何代码..我只能告诉逻辑..你可以通过

获得selectedtab索引
var index= ($tabs.tabs('option', 'selected'));

然后将索引与获取的索引进行比较,如果匹配,则按

打开您的fancybox
$(".fancy").fancybox().trigger('click');

你可以在fancybox的sumbit / close上编写自己的函数

$("<YOUR-SELECTOR>").fancybox({
  onClosed: function() {
 // your own functions
      });
  });