jQuery选项卡-选择创建内容面板的位置



我想知道是否有可能在指定位置动态创建选项卡面板?

目前我的选项卡是通过加载一些json动态创建的。我的div结构是这样的:

<div id="tabs">
  <ul id="tablist"></ul>
</div>

然后动态地填充类似于下面的结构…

<div id="tabs">
  <ul id="tablist">
   <li><a href="#panel1">blah1</a></li>
   <li><a href="#panel2">blah2</a></li>
   <li><a href="#panel3">blah3</a></li>
  </ul>
  <div id="panel1">Some content...</div>
  <div id="panel2">Some content...</div>
  <div id="panel3">Some content...</div>
</div>

我想告诉jQuery在我选择的父div中创建面板div,例如'#panels':

<div id="tabs">
  <ul id="tablist"></ul>
</div>
<div id="panels"></div>

这可能吗?谢谢。

仅供参考,我没有使用通用的ui选项卡外观&感觉,所以不受任何容器设计的约束。

我想知道是否有可能在指定位置动态创建选项卡面板?

不容易(我看)。

如果你真的想要,你可以通过

得到类似的行为
  • 创建第二个无序列表
  • 改变当前无序列表的样式,使其不显示,
  • 绑定事件,这样单击新列表中的任何选项卡都会触发"真实"列表中的"点击"事件。

或者,您可以通过

进行"另一种方式"并获得类似的行为
  • 创建第二组面板
  • 改变"真实"面板的样式,使它们不显示,
  • 拦截"tabsselect"(和类似的事件)并触发相应的显示变化在你的新面板。

值得注意的是,jQuery UI选项卡API目前正在重新设计。有一个pre-alpha里程碑可用,他们被要求评论。当然,请求将此作为一项功能并看看他们的反应不会有什么坏处。(如果没有别的,他们可能有比上面更好的主意。)

相关内容

  • 没有找到相关文章