2015-08-20 3 views
0

У меня есть следующий код. Когда пользователь нажимает кнопку, мне нужно переключить вкладки. Я вижу, что вкладка переключается на мгновение, но сразу переключается на первую вкладку. Почему это? Как решить эту проблему?Переключение jQuery UI не работает

<div id="tabs"> 
     <ul> 
      <li><a href="#tabs-1">A</a></li> 
      <li><a href="#tabs-2">B</a></li> 
      <li><a href="#tabs-3">C</a></li> 
      <li><a href="#tabs-4">D</a></li> 
     </ul> 

     <div id="tabs-1"> 
      <div class="input"> 
      <form> 
       <fieldset> 
        <legend>Data source</legend> 
        Blah blah 
       </fieldset> 

       <fieldset> 
        <legend>Legend</legend> 
        <div id="accordion"> 
         <h4>Check sequence</h4> 
         <div>        
          <button id="submitCheckSequence">Test!</button>  
         </div> 
         <h4>Random section</h4> 
         <div>        
         </div> 
        </div> 
       </fieldset>  
      </form> 
     </div> 

     </div> 
     <div id="tabs-2"> 
      <p>Blah</p> 
     </div> 
     <div id="tabs-3"> 
      <p>Blah</p> 
     </div>  
     <div id="tabs-4"> 
      <textarea rows="4" cols="50" readonly> 
       Blah 
      </textarea> 
     </div>  
    </div> 

    <script type="text/javascript"> 
     $(document).ready(function() { 
      $("#tabs").tabs(); 
      $("#accordion").accordion(); 

      $("#submitCheckSequence").click(function() { 
       $("#tabs").tabs("option", "active", 3); 
      }); 
     }); 

    </script> 

ответ

1

http://jsfiddle.net/x01nkasj/1

Вот рабочая скрипку. @Odelibalta верна в исправлениях, но базовый фрагмент, чтобы предотвратить попытку POST, заключается в следующем.

 $("#submitCheckSequence").click(function (event) { 
      event.preventDefault(); 
      $('#tabs').tabs("option", "active", 2); 
     }) 
1

<div class="input"> не имеет закрывающего тега. Кроме того, ваш button находится внутри формы. Вероятно, почему это освежает после нажатия кнопки в этой форме. Дайте name атрибут вашей формы и сделайте e.preventDefault на нем. Если у вас нет других входных данных для этой формы, я бы вынул форму и оставил кнопку там один. Этот способ работает на jsfiddle.

Смежные вопросы