1

我正在尝试从href链接到 jQuery 选项卡，但它似乎不起作用。你如何去做这件事。我希望在用户单击链接时打开一个选项卡。到目前为止，这是我的代码：http: //jsfiddle.net/AXEEe/。

HTML

<a href="#Allocated">Allocated</a>
<a href="#Declined">Declined</a>
<a href="#Pending">Pending</a>
<a href="#Failed">Failed</a>

<div style="padding-top: 10px">
  <div id="tabs">
    <ul>
      <li><a href="#Allocated" id="#Allocated">Allocated Requests</a></li>
      <li><a href="#Declined">Declined Requests</a></li>
      <li><a href="#Pending">Pending Requests</a></li>
      <li><a href="#Failed">Failed Requests</a></li>
      </ul>
          <div id="Allocated">
              Content 1
          </div>
          <div id="Declined">
              Content 2
          </div>
          <div id="Pending">
              Content 3
          </div>    
          <div id="Failed">
              Content 4
          </div>
        </div>
</div>

​<strong>JS

$(function() {
        $( "#tabs" ).tabs();
});​
4

2 回答 2

3

要选择带有链接的选项卡，请执行以下操作：http: //jsfiddle.net/AXEEe/1/

<a id="0" href="#">Allocated</a>
<a id="1" href="#">Declined</a>
<a id="2" href="#">Pending</a>
<a id="3" href="#">Failed</a>

    $('a').click(function(){
       $("#tabs").tabs("option", "active", parseInt(this.id));
    });

对于此示例，我刚刚使用选项卡链接添加id到您的<a>链接。你可以做得更好。到你的项目。询问您是否有更多问题

编辑

更新选项卡部分方法以符合 JQUery UI 1.9

于 2012-11-08T22:44:45.377 回答
3 
$(function() {
    $("#tabs").tabs();
    $("a[href=#Allocated]").click(function() {
        $("#tabs").tabs("option", "active", 0);
    });
    $("a[href=#Declined]").click(function() {
        $("#tabs").tabs("option", "active", 1);
    });
    $("a[href=#Pending]").click(function() {
        $("#tabs").tabs("option", "active", 2);
    });
    $("a[href=#Failed]").click(function() {
        $("#tabs").tabs("option", "active", 3);
    });
});​

小提琴

于 2012-11-08T23:07:01.470 回答