为什么自动选项卡更改后 setInterval 不起作用

Question

I used JQuery .tab() to built a tab , and I wanted to make it could be continuous auto switching tab , but it did't work after loaded the page. I found out that when I imported this external script, the auto tab didn't work.

<script type="text/javascript" src="/solar_energy/lib/jquery-1.9.1.min.js"></script>

Here is my code, please help me to know why it didn't work. Thx.

 var n = 3, //number of tabs i = 0; // current tab $("#tabs").tabs(); setInterval(function() { i = (++i < n ? i : 0); $("#tabs").tabs("option", "active", i); }, 2000);

 <div id="tabs"> <ul> <li><a href="1.html">tab 1</a> </li> <li><a href="2.html">tab 2</a> </li> <li><a href="3.html">tab 3</a> </li> </ul> </div>

Answer 1

Your code work fine take a look at Working Fiddle , just make sure that your jquery-ui is included correctly and check your console if there's an error.

HTML :

<div id="tabs">
  <ul>
    <li><a href="1.html">tab 1</a>
    </li>
    <li><a href="2.html">tab 2</a>
    </li>
    <li><a href="3.html">tab 3</a>
    </li>
  </ul>
</div>

JS :

var n = 3, //number of tabs
  i = 0; // current tab

$("#tabs").tabs();
setInterval(function() {
  i = (++i < n ? i : 0);
  $("#tabs").tabs("option", "active", i);
}, 2000);

If your code work without <script type="text/javascript" src="/solar_energy/lib/jquery-1.9.1.min.js"></script> i guess that you're already included jquery somewhere in your code.