jquery - 通过不同的 DOM 元素进行 Jquery 选项卡选择

Question

我在一个页面上有 4 个标签，代码如下：

<div id="tabs">
  <ul>
    <li><a href="#tab-brandy">BRANDY</a></li>
    <li><a href="#tab-whisky">WHISKY</a></li>
    <li><a href="#tab-gin">GIN</a></li>
    <li><a href="#tab-wine">WINE</a></li>
  </ul>

  <div id="tab-brandy">
    <!-- Tab brandy contents -->
  </div>

  <div id="tab-whisky">
    <!-- Tab whisky contents -->
  </div>

  <!-- Similarly tab GIN and tab WINE -->

在 tab-brandy 里面有一个像这样的按钮元素：

 <button id="#moveToWhisky">WHISKY</button>

tab-whisky"当单击带有 id的按钮时，我想将选项卡更改为“ "#moveToWhisky"。

所以这是脚本：

//Document ready
  $("#tabs").tabs({
    var tabOpts = {
     selected: 1
    };
    $("#Tabs").tabs(tabOpts);
  });

上述方法无效，所以我尝试了这个：

    $("#tabs").tabs({
      $("#tabs").tabs("select", 2) //2 is tab number
  });

所以最后这样做了：

    $("#moveToWhisky").click(function(){
        $("#tabs").tabs("select", 2);
     });

似乎没有任何效果，我做错了什么？

Answer 1

要设置活动选项卡，您需要调用option 方法来更改active的值：

$("#tabs").tabs("option", "active", 2);