1

我的代码中有标签和列表。我正在使用 jquery 作为标签。代码是：

<div id ="xvz">
<!--list one here-->
   <ul>
      <li>item 1</li>
      <li>item 2</li>
   <ul>
<!--list for tabs here-->
   <ul>
      <li>tab 1</li>
      <li>tab 2</li>
   <ul>
</div>

在js文件中，

$("#xyz").tabs();

此代码使第一个列表成为选项卡式列表，第二个是纯 html 列表。我应该怎么做才能使第二个是选项卡式的。一种解决方案是将第二个列表放在 div 元素中，然后对其应用选项卡功能。但我不想碰我的 html 代码。有没有办法我可以通过更改 js 来做到这一点。提前致谢

4

2 回答 2

0

我不知道应该如何使用该插件。如果应该在列表容器上调用它，您可以执行以下操作：

// get the second list and wrap it into div#listWrapper
$("#xyz ul").eq(1).wrap('<div id="listWrapper"></div>');

// activate tabs on the list inside our new wrapper
$('#listWrapper').tabs();

如果可以在列表本身上调用它，那么您可以简单地执行以下操作：

$("#xyz ul").eq(1).tabs();

编辑

如果即使使用 javascript 也不想更改 html 代码，则只能在选项卡初始化时更改它：

var $xyz = $("#xyz");
var $firstUl = $xyz.find("ul").eq(0);
var $secondUl = $xyz.find("ul").eq(1);

// swap lists:
$xyz.append($firstUl);

// init tabs
$xyz.tabs();

// swap again
$xyz.prepend($firstUl);
于 2013-07-03T09:00:24.987 回答
0

在这种情况下，您似乎不走运，因为插件似乎正在获取第一个ol,ul元素来创建选项卡

_getList: function() {
    return this.element.find( "ol,ul" ).eq( 0 );
},
于 2013-07-03T09:04:10.110 回答