使用变量

时,setTimeout()方法不执行。 我试图编写一个在单击元素时为元素绘制底边框的函数。 该函数使用元素,最小宽度和最大宽度作为参数。 当我将其与setTimeout()一起使用时,它本身不起作用。 如果我在setTimeout()中使用实际数字,则可以正常工作。 我找不到问题所在... 有人可以帮忙吗? 谢谢!
function drawBorder(elem,start_wid,end_wid)
{

//Checks if the header is in starting position.
//if it is - expend the width. If not decrease the width up to the starting
//position.
 if (elem.clientWidth <= start_wid)
  {
   increaseBorder(elem, end_wid);
  }
 else if (elem.clientWidth >= end_wid)
 {
  decreaseBorder(elem, start_wid);
 }
}


function increaseBorder(elem, end_wid)
 {
  elem.style.width=elem.clientWidth + 3 + \"px\";
  if (elem.clientWidth >= end_wid)
    {
     clearTimeout(timer2);
    }
  else {
    var str=\"increaseBorder(\" + elem + \", \" + end_wid + \");\";            
    timer2=setTimeout(str,3);
 }
}

function decreaseBorder(elem, start_wid)
 {
  elem.style.width=elem.clientWidth - 3 + \"px\";
  if (elem.clientWidth <= )
   {
   clearTimeout(timer2);
   }
  else {
   var str=\"decreaseBorder(\" + elem + \", \" + start_wid + \");\";
   timer2=setTimeout(str,3);
 }
}
    
已邀请:
您不能将对元素的引用作为字符串传递。这个
var str=\"increaseBorder(\" + elem + \", \" + end_wid + \");\";
会导致类似
\"increaseBorder([object ...], 100);\"
因为对象的默认字符串表示形式是“ 3”。评估字符串时,甚至会导致语法错误。 切勿将字符串传递给
setTimeout
。直接传递函数:
function increaseBorder(elem, end_wid) {
     elem.style.width=elem.clientWidth + 3 + \"px\";
     if (elem.clientWidth >= end_wid) {
         clearTimeout(timer2);
     }
     else {          
         timer2 = setTimeout(function(){
             increaseBorder(elem, end_wid);
         }, 3);
     }
}
进一步说明: 您还应该修复其他错误,例如
if (elem.clientWidth <= )
,并且应始终调用
clearTimeout
,以停止从其他函数启动的超时。     
似乎函数
increaseBorder
decreaseBorder
未全局声明。当字符串传递给
setTimeout
时,将在全局上下文中对其进行求值,这似乎是问题所在。无需传递字符串,只需将函数传递给setTimeout。
var timer = setTimeout(function() {
    increaseBorder(elem, end_wid);
}, 3);
    

要回复问题请先登录注册