Question

我在jquery选项卡中嵌套了标签，如果我们想要静态jquery标签，那么这些选项很简单

但是如果我们想要嵌套选项卡，那么远程页面应该决定选项卡是什么。

或换句话说，我希望在远程页面（或ajaxified）中嵌套选项卡

例如，我通过标签

调用此页面（远程页面）

<div id="container-2">

  <ul>
  <li><a href="#fragment-1a"><span>Section 1a</span></a></li>
  <li><a href="#fragment-1b"><span>Section 1b</span></a></li>

  <li><a href="#fragment-1c"><span>Section 1c</span></a></li>

  </ul>
  <div id="fragment-1a">
  Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
  </div>
  <div id="fragment-1b">
  Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
  Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
  </div>
  <div id="fragment-1c">

  Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
  Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
  Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
  </div>

  </div>

在主页面中我有

<script type="text/javascript">
$(function(){
$('#tabs').tabs();
$("#container-2").tabs();
});
</script>
<div id="tabs">
        <ul>
                <li><a href="remote.jsp"><span>Requests</span></a></li>
      </ul>
  </div>

但我无法在远程页面中获取嵌套选项卡。

它们采用简单的列表形式。

任何帮助

由于

Pradyut

Answer 1

只有在加载后才需要调用＃container-2上的tabs（）函数。当您使用远程选项卡时，在打开选项卡之前不会加载内容，这意味着在$（document）.ready（）触发的同时，选项卡的内容不会添加到DOM中。试试这个：

<script type="text/javascript">
 $(function(){
    $('#tabs').tabs({
     load: function(event, ui) {
        $("#container-2").tabs();
     }
    });
 });
</script>

我还没有对它进行过测试，所以你可能需要调整load函数中的代码来使其正常工作，但这无论如何都应该让你开始。

Answer 2

您正在尝试将tabs()绑定到$('#container-2')，而$('#tabs').tabs({ load: function(event, ui){ $("#container-2").tabs(); } });不存在。您需要在加载选项卡内容后执行此操作。

{{1}}

Answer 3

遥控器本身应该有一个脚本

<script type="text/javascript">

  $(function(){
  $('#tabs-2').tabs();
  });
  </script>

示例网址： -

http://pradyut.dyndns.org/WebApplicationSecurity/newtab.jsp

远程jquery嵌套选项卡

3 个答案: