Управление вкладками jQuery с помощью предыдущей/следующей кнопки

Question

У меня есть контроль над вкладками с помощью кнопки. Я хочу, чтобы пользователь прошел вкладки по порядку. Каждая вкладка имеет другую 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> 

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> 

Answer 1

Может быть, потому что ваши кнопки типа "submit", и они принудительного обновления страницы? Попробуйте изменить их на <input type="button" ... />

Кроме того, избавиться от тегов <a> вокруг кнопок.

Используйте либо кнопку <input type='button'> ИЛИ ссылку <a href='...'>text</a>, нет смысла иметь ссылку, обертывающую кнопку.