JS:程序能運行，但是無延遲效果。setTimeout(obtn[this.index].onmouseout=function ()意義何在？
function jianjie()
{
var ms=document.getElementsByTagName('span');
var obtn=document.getElementsByTagName('input');
var i=0;
? ? for (var i = 0; i < obtn.length; i++)
{
? ? ? ? obtn[i].index = i;
? ? ? ? obtn[i].onclick= function ()?
{
? ? ? ? ? ms[this.index].style.display = 'block';
? ? ? ? }
obtn[i].onmouseout=function ()
{
setTimeout(obtn[this.index].onmouseout=function () ?//這句按道理應(yīng)該是setTimeout(function ()，但是寫成這樣就不能運行了。
{
ms[this.index].style.display = 'none';
},3000);
}
}
}
//主要目的是第三個input控制第三個SPAN的延遲隱藏與顯示。
2016-11-01
按照你的思路寫了個完整的，應(yīng)該是這樣，幾個改動地方有注釋：
<!DOCTYPE?HTML> <html> <head> ????<meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8"> ????<title>無標(biāo)題文檔</title> </head> <body> <div?style="width:100px;height:100px;"> ????<span>234234</span> </div> <input?type="button"> <script> ????function?jianjie()?{ ????????var?ms?=?document.getElementsByTagName('span'); ????????var?obtn?=?document.getElementsByTagName('input'); ????????var?i?=?0; ????????var?timer ????????for?(var?i?=?0;?i?<?obtn.length;?i++)?{ ????????????obtn[i].index?=?i; ????????????obtn[i].onclick?=?function?()?{ ????????????????clearTimeout(timer);?????????????????//保證點擊時不會隱藏 ????????????????ms[this.index].style.display?=?'block'; ????????????} ????????????obtn[i].onmouseout?=?function?()?{ ????????????????clearTimeout(timer);??????????????????//每次移出時確保只執(zhí)行一個定時器 ????????????????var?a?=?this.index ????????????????//將this.index用a變量來保存，因為this.index只有在事件觸發(fā)時才會有值，如果設(shè)置了settimeout就是undefined，因此用變量將它保存起來 ????????????????timer?=?setTimeout(function?()?{ ????????????????????ms[a].style.display?=?'none'; ????????????????},?3000); ????????????} ????????} ????} ????jianjie() </script> </body> </html>2016-11-01
<!DOCTYPE?HTML> <html> <head> ????<meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8"> ????<title>無標(biāo)題文檔</title> </head> <body> <div?style="width:100px;height:100px;"> ????<span>234234</span> </div> <input?type="button"> <div?style="width:100px;height:100px;"> ????<span>234234</span> </div> <input?type="button"> <div?style="width:100px;height:100px;"> ????<span>234234</span> </div> <input?type="button"> <script> ????function?jianjie()?{ ????????var?ms?=?document.getElementsByTagName('span'); ????????var?obtn?=?document.getElementsByTagName('input'); ????????var?i?=?0; ????????var?timer ????????for?(var?i?=?0;?i?<?obtn.length;?i++)?{ ????????????obtn[i].index?=?i; ????????????obtn[i].onclick?=?function?()?{ ????????????????clearTimeout(obtn[this.index].timer);?????????????????//保證點擊時不會隱藏 ????????????????ms[this.index].style.display?=?'block'; ????????????} ????????????obtn[i].onmouseout?=?function?()?{ ????????????????clearTimeout(obtn[this.index].timer);????//每次移出時確保只執(zhí)行一個定時器 ????????????????var?a?=?this.index ????????????????//將this.index用a變量來保存，因為this.index只有在事件觸發(fā)時才會有值，如果設(shè)置了settimeout就是undefined，因此用變量將它保存起來 ????????????????obtn[this.index].timer?=?setTimeout(function?()?{ ????????????????????ms[a].style.display?=?'none'; ????????????????},?3000); ????????????} ????????} ????} ????jianjie() </script> </body> </html>