Javascript 使用上一个/下一个按钮控制jQuery选项卡

我有一个相当不错的战斗控制选项卡通过一个按钮点击功能。我希望用户按顺序浏览选项卡。每个选项卡都有不同的html表单。因此，按钮也提供了验证。但主要问题是“下一个”和“上一个”按钮根本不起作用。为什么按钮根本不改变标签

jQuery

<script type="text/javascript">
    $(".nexttab").click(function() {
        var selected = $("#tabs").tabs("option", "selected");
        $("#tabs").tabs("option", "selected", selected + 1);
    });

    $(".backtab").click(function() {
        var selected = $("#tabs").tabs("option", "selected");
        $("#tabs").tabs("option", "selected", selected - 1);
    });
</script>

$（“.nexttab”）。单击（函数（）{
所选变量=$（“选项卡”）。选项卡（“选项”，“所选”）；
$（“#制表符”）。制表符（“选项”、“选定项”、“选定项+1”）；
});
$（“.backtab”）。单击（函数（）{
所选变量=$（“选项卡”）。选项卡（“选项”，“所选”）；
$（“#制表符”）。制表符（“选项”，“选定”，选定-1）；
});

HTML

<div id="convertThis">
    <div id="tabs">
        <div href="#a" rel="a" title="./images/icons/category1.png">Category 1</div>
        <div href="#b" rel="b" title="./images/icons/category2.png">Category 2</div>
    </div>

    <div id="divs">
        <div id="a">
               <form action="" method="post">
                 CATEGORY 1 FORM CONTENT
                    <div class="tabController">
                        <div class="tabNext">
                        <input type="button" class="nexttab" value="Next &gt;&gt;" name="submit" id="submit" style="background: #EFEFEF; float:right;"/>
                        </div>
                    </div>
                </form>
        </div>
        <div id="b">
             <form action="" method="post" id="post2">
                    CATEGORY 2 FORM CONTENT
                 <div class="tabController">
                     <div class="tabBack">
                        <input type="button" class="backtab" value="&lt;&lt; Previous" name="submit2" id="submit2" style="background: #EFEFEF;"/>
                     </div>
                 <div class="tabNext">
                        <input type="button" class="nexttab" value="Next &gt;&gt;" name="submit" id="submit" style="background: #EFEFEF; float:right;"/>
                </div>
                </div>
           </form>
        </div>
    </div>
</div>

第一类
第2类
第1类表格内容
第2类表格内容

可能是因为您的按钮类型为“

提交”

，它们强制刷新页面？尝试将它们更改为

---

另外，去掉

，没有必要用一个链接包装一个按钮。

添加了jquery ui-*标记，选项卡在jquery中不受本地支持。我认为在

中嵌套

甚至不是有效的HTML…@Craino，谢谢你的提示。更改类型=按钮后，它仍然不起作用。@jonthecoder2346您必须删除

标记，但将其类（如

tabNext

）也赋予按钮