jQuery的定時執行和延遲執行
//延遲執行setTimeout(function(){console.log("實戰授課，100%就業");},600);//定時執行var id = setInterval(function(){console.log("來武漢長樂教育學PHP");}, 600)//注意，以上兩個函數中的第一個參數，都可以放在外部，例如function t(){console.log("精通PHP開發");}setTimeout(t, 600);//清除定時執行clearInterval(id);
//下面看案例，還是選項卡的
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=" /><title></title><style>*{ margin:0; padding:0;}body { font:12px/19px Arial, Helvetica, sans-serif; color:#666;}.tab { width:240px;margin:50px;}.tab_menu { clear:both;}.tab_menu li { float:left; text-align:center; cursor:pointer; list-style:none; padding:1px 6px; margin-right:4px; background:#F1F1F1; border:1px solid #898989; border-bottom:none;}.tab_menu li.hover { background:#DFDFDF;}.tab_menu li.selected { color:#FFF; background:#6D84B4;}.tab_box { clear:both; border:1px solid #898989; height:100px;}.hide{display:none}</style><!-- 引入jQuery --><script src="static/js/jquery-2.1.1.min.js" type="text/javascript"></script><script type="text/javascript" >//<![CDATA[$(function(){var $div_li =$("div.tab_menu ul li"); //取得jquery對象var i = 0; //當前的索引數是0var l = $div_li.length; //一共幾頁function t(){i++; //當前頁數自增if(i==l) { //如果已經到最后一頁，恢復到第一頁i = 0;}$div_li.eq(i).addClass("selected").siblings().removeClass("selected");$("div.tab_box > div").eq(i).show().siblings().hide();}var id = setInterval(t, 1000);$div_li.hover(function(){var $t = $(this);setTimeout(function(){$t.addClass("selected").siblings().removeClass("selected");var index = $t.index(); //取得索引數$("div.tab_box > div").eq(index).show().siblings().hide();}, 300);clearInterval(id); //清除定時器}, function(){i = $(this).index(); //當前索引數id = setInterval(t, 1000);})})//]]></script></head><body><div class="tab"><div class="tab_menu"><ul><li class="selected">時事</li><li>體育</li><li>娛樂</li></ul></div><div class="tab_box"><div>時事</div><div class="hide">體育</div><div class="hide">娛樂</div></div></div></body></html>