Javascript 使用<；a>；标签

我在几篇文章中发现，可以使用按钮或标记导航JqueryUI选项卡

我正在使用这个简单的方法

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

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

    $(".changeTab").click(function() {
        alert("asdas");
        var selected = $("#tabsinner").tabs("option", "selected");
        $("#tabsinner").tabs("option", "selected", selected + 1);
    });

以及html：

<div id="vtabs">
<ul id="verticalUl">
    <li><a href="#vtab-1">Outer Tab 1</a></li>
    <li><a href="#vtab-2">Outer Tab 2</a></li>
    <li><a href="#vtab-3">Outer Tab 3</a></li>
</ul>
<div id="vtab-1">
    <div id="tabsinner" >
        <ul id="horizontalUl">
            <li><a href="#tabsinner-1">Inner Tab 1</a></li>
            <li><a href="#tabsinner-2">Inner Tab 2</a></li>
            <li><a href="#tabsinner-3">Inner Tab 3</a></li>
        </ul>
        <div id="tabsinner-1">
            <h2>Content heading 1</h2>
            <button type="button" class="nexttab">Next Tab</button>
        </div>
        <div id="tabsinner-2">
            <h2>Content heading 2</h2>
            <button type="button" class="nexttab">Next Tab</button>
        </div>
        <div id="tabsinner-3">
            <h2>Content heading 3</h2>
        </div>
    </div>
</div>
<div id="vtab-2">
    <h2>Vertical Tab Content heading 2</h2>       
</div>
<div id="vtab-3">
    <h2>Vertical Tab Content heading 3</h2>
</div>

内容标题1
下一页
内容标题2
下一页
内容标题3
垂直选项卡内容标题2
垂直选项卡内容标题3

现在我在左侧使用垂直选项卡，而在外部选项卡（嵌套选项卡）内部使用更多的水平选项卡。现在我认为这不是问题，因为我移除了外部的，但仍然不起作用

---

谢谢

我可以看到两个问题，下一步按钮的类别是

nexttab

，使用的选项是

---

演示：

是的，它起作用了，尽管我在示例中输入了错误的类，但我只需将selected更改为active。谢谢！！

$(".nexttab").click(function () {
    var selected = $("#tabsinner").tabs("option", "active");
    $("#tabsinner").tabs("option", "active", selected + 1);
});