Jquery 超简单实现图片切换

今天写代码实在不顺，好吧，我连自己比较输的Jquery都忘的差不多了。来吧，写一个比较简单的图片切换功能。

思路很简单，每一秒全部先隐藏，然后显示出下一个。

html：

<td style="height:400px" colspan="3" align="center" id="image"><img src="image/index/1.png" style="width:595px; height:400px;"align="center" /><img src="image/index/2.png" style="width:595px; height:400px;display:none;"align="center" /><img src="image/index/3.png" style="width:595px; height:400px;display:none;"align="center" /><img src="image/index/4.png" style="width:595px; height:400px;display:none;"align="center" /><img src="image/index/5.png" style="width:595px; height:400px;display:none;"align="center" /><img src="image/index/6.png" style="width:595px; height:400px;display:none;"align="center" /></td>

js

$(function(){

var i=0;

var images=$("#image").children("img");

function roll(){

images.hide();

debugger;

if(i==6)

i=0;

$(images[i]).show();

i++;

setTimeout(roll, 1000);

};

roll();

});

setTime()中参数若写成setTimeout("roll()",1000);则前台报错

   

好吧，再就是值得注意的是，images是Jquery对象数组，Jquery中遍历只有each()方法，我想用for，就必须把Jquery对象转成js对象，即images[i]；然后$()一下把js对象再转成Jquery对象，执行show()方法。结束。实现方法很多，只是我用这个方法实现，值得注意的地方多点，也算记录一下，哈哈。