本文实例讲述了jquery图形密码实现方法。分享给大家供大家参考。具体实现方法如下: 复制代码 代码如下: <br /> $(document).ready(function() {<br /> var n=0,y=['4','8','12','13','14','15','16'];<br /> for(var i=1;i<=16;i++){<br /> var Box='<span id="box_'+i+'" class="box" num="0">';<br /> $('#lower').append(Box);<br /> if(i<=4){<br /> $('#box_'+i+'').animate({left:100*i-100+"px"}, 0)<br /> .show(0).delay(i*400-400).animate({width:"90px",height:"90px",top:"300px"}, 800).attr("num",i);<br /> }else if(i<=8){<br /> $('#box_'+i+'').animate({left:100*i-500+"px"}, 0)<br /> .show(0).delay(i*400-400).animate({width:"90px",height:"90px",top:"200px"}, 800).attr("num",i);<br /> }else if(i<=12){<br /> $('#box_'+i+'').animate({left:100*i-900+"px"}, 0)<br /> .show(0).delay(i*400-400).animate({width:"90px",height:"90px",top:"100px"}, 800).attr("num",i);<br /> }else{<br /> $('#box_'+i+'').animate({left:100*i-1300+"px"}, 0)<br /> .show(0).delay(i*400-400).animate({width:"90px",height:"90px",top:"0px"}, 800).attr("num",i);<br /> }<br /> };<br /> $('#lower span').bind("click",function(){<br /> $(this).addClass("select");<br /> var code=$(this).attr("num");<br /> for (var j=0; j<y.length; j++){<br /> if(code==y[j]){<br /> y = jQuery.grep(y, function(n, i){<br /> return (n != code);<br /> });<br /> n=n+1;<br /> }else{<br /> n=n+0;<br /> }<br /> };<br /> if($('.select').length==7){<br /> if(n==7){<br /> $('#lower').empty().append('<a href="#">');<br /> $('#lower a').fadeIn(800);<br /> }else{<br /> $('#page').delay(1000).append('<div id="tips"><p>密码错了,重来吧! '); $('#tips').slideDown(500).delay(2000).slideUp(500); $('#lower span').removeClass("select"); n=0; y=['4','8','12','13','14','15','16']; } } }); }); 希望本文所述对大家的jquery程序设计有所帮助。