首页 > 代码库 > 逐个后移，匹配符合要求的选项，ie7有bug
逐个后移，匹配符合要求的选项，ie7有bug
<!DOCTYPE html><html><head><meta charset="utf-8" /><title>验证</title><style>#wrap{ width:215px; height:200px; border:1px solid #ddd; margin-top:10px; overflow:auto; position:relative;}#wrap ul{ padding:0; margin:0;}#wrap ul li{ width:50px; margin:5px 2px 5px 11px; height:30px; background:#CFC; float:left; font-size:13px; list-style:none; line-height:30px; text-align:center;}#wrap ul li.yes1{ background:#40F0ED;}#wrap ul li.yes2{ background:#5F3FEF;}#wrap ul li.yes3{ background:#EF3FD7;}#wrap ul li.yes4{ background:#5F3FEF;}#wrap ul li.yes5{ background:#f00;}#wrap ul li.no{ background:#F39;}#tipInfor{ position:absolute; left:0; top:0; overflow:hidden; height:0; z-index:10; width:100%; background:#f1f1f1; color:#333; font-size:13px; font-weight:bold; line-height:24px;}</style></head><body><div> <input type="text" /> <button>开始</button></div><div id="wrap"><div id="tipInfor">亲爱的校友，你填入的名称与学校档案库的姓名，匹配不成功，请您继续报到，我们会进行后台审核并及时更新</div> <ul> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> <li>6</li> <li>7</li> <li>8</li> <li>9</li> <li>10</li> <li>11</li> <li>12</li> <li>王志伟</li> <li>14</li> <li>15</li> <li>16</li> <li>17</li> <li>18</li> <li>19</li> <li>20</li> <li>21</li> <li>22</li> <li>23</li> <li>24</li> </ul></div></body></html><script type="text/javascript">var obj=document.getElementById("wrap");var btn=document.getElementsByTagName("button")[0];var aLi=document.getElementsByTagName("li");var a=document.getElementById("tipInfor");btn.onclick=function(){ init(); obj.style.overflow="auto"; var txt=document.getElementsByTagName("input")[0].value; var i=0; btn.timer=setInterval(function(){ if(i==aLi.length){ clearInterval(btn.timer) obj.style.overflow="hidden"; a.style.height="100%"; obj.scrollTop=0; return; } console.log(aLi[i].innerHTML+"~~~~"+txt) if(aLi[i].innerHTML!=txt){ obj.scrollTop=aLi[i].offsetTop*0.7; aLi[i].className="no"; }else{ blinkBg(aLi[i]); clearInterval(btn.timer); } i++; },100) }function init(){ for(var i=0;i<aLi.length;i++){ aLi[i].className=""; } a.style.height=0;}function blinkBg(obj){ var bgArr=["yes1","yes2","yes3","yes4","yes5"] var i=0; obj.timer=setInterval(function(){ if(i==bgArr.length-1){ clearInterval(obj.timer); } obj.className=bgArr[i]; i++; }, 150) }</script>
逐个后移，匹配符合要求的选项，ie7有bug
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。