Как правильно вызвать clearTimeout? (Тайм-аут идентификатор потерян?) - PullRequest
Новая
       8

Как правильно вызвать clearTimeout? (Тайм-аут идентификатор потерян?)

3 голосов
/ 29 апреля 2010

Я пытаюсь сделать простой setTimeout, чтобы сделать тег div невидимым через 2 секунды.

Функция setTimeout делает div невидимым, но нерегулярно, иногда сразу, а иногда через 1 секунду и т. Д.

Вот мой код: 

  function beginTimeOut(){

    t = setTimeout(function(){hideSubMenu()},2000);

}

function hideSubMenu(){
    var elem;
    elem = document.getElementById("ul_navlist1");
    elem.style.visibility="hidden";
    clearTimeout(t);

}

Кстати, t - глобальная переменная. Я тоже попробовал это: t = setTimeout("hideSubMenu()",2000);, но с такими же нерегулярными результатами.

ОБНОВЛЕНИЕ ОП:

Это div, который содержит мое меню и подменю. Я отредактировал его, чтобы его можно было немного прочитать.

Right_rect - это div, который содержит меню и подменю. В этом разделе я вызываю onmouseout, чтобы скрыть подменю. 

<div class="right_rect"  onmouseout="beginTimeOut();">      
        <div class="menu2" >
            <ul >
            <li onclick="hideOrShow();"><a href="#">item1</a></li>
                </ul>
        </div>

    <div id="ul_navlist1">
        <ul >
                    <li><a href="#">sub_item1</a></li>
            </ul>
        </div>      
</div>

и это часть javascript, которую я использую для выполнения процесса скрытия и показа. 

function hideOrShow(){
    var hOrV;
    var elem;
    var styleType = "visibility";
    elem = document.getElementById("ul_navlist1");
    hOrV = getStyle(elem, styleType);
    if(hOrV =="hidden"){
        //alert();
        elem.style.visibility="visible";
    }else{
        elem.style.visibility="hidden";
    }
}

function beginTimeOut(){
    setTimeout(function(){document.getElementById("ul_navlist1").style.visibility="hidden";}, 2000);

}

function getStyle(oElm, strCssRule){
    var strValue = "";
    if(document.defaultView && document.defaultView.getComputedStyle){
        strValue = document.defaultView.getComputedStyle(oElm, "").getPropertyValue(strCssRule);
    }
    else if(oElm.currentStyle){
        strCssRule = strCssRule.replace(/\-(\w)/g, function (strMatch, p1){
            return p1.toUpperCase();
        });
        strValue = oElm.currentStyle[strCssRule];
    }
    return strValue;
}

Функция getStyle - не мой код.

Ответы [ 2 ]

2 голосов
/ 29 апреля 2010

Вы можете сделать это: 

function beginTimeOut(){
  setTimeout(hideSubMenu,2000);
}

function hideSubMenu(){
  document.getElementById("ul_navlist1").style.visibility="hidden";
}

setTimeout() запускается только один раз, нет необходимости очищать его, если только вы не хотите остановить его выполнение до того, как это произойдет. Я не уверен из твоего вопроса, куда ты звонишь beginTimeOut(), но время, когда оно начинается, может отличаться. Я бы сделал это в каком-либо событии load документа или в конце вашего <body>, в зависимости от того, что еще у вас запущено.

Как примечание, вы можете поместить это в одно утверждение, например: 

setTimeout(function() {
  document.getElementById("ul_navlist1").style.visibility="hidden";
}, 2000);
1 голос
/ 29 апреля 2010

Поскольку вы очищаете время ожидания с помощью глобальной переменной, нет гарантии, что это будет правильное время ожидания, которое будет очищено. Что если вы позвоните beginTimeout до того, как истечет предыдущий тайм-аут? Как сказал Ник Крейвер, вам, вероятно, не нужно очищать тайм-аут.

Ошибка кодирования, которую я видел не раз, - это код, который использует setInterval / setTimeout, и дескриптор перезаписывается, а интервал неожиданно сохраняется. Лучше всего захватывать интервал, когда он создан, используя этот довольно тупой код: 

var t=setInterval(function(){doStuff(t)},1000)

Так что дескриптор интервала срабатывания передается обработчику. Это позволяет избежать проблемы его хранения в глобальном масштабе.

...