3

2秒後にdivタグを非表示にするために、単純なsetTimeoutを作成しようとしています。

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);たが、同じ不規則な結果になりました。

OPからの更新：

これは、メニューとサブメニューを含む div です。ここで少し読みやすいように編集しました。

right_rect は、メニューとサブメニューを含む div です。この 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 関数は私のコードではありません。

4

2 に答える 2

2

あなたはこれを行うことができます：

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);
于 2010-04-28T23:30:18.113 に答える
1

グローバル変数を使用してタイムアウトをクリアしているため、クリアされるのが正しいタイムアウトになるという保証はありません。前のタイムアウトが完了する前に beginTimeout を呼び出すとどうなりますか? Nick Craver が言ったように、おそらくタイムアウトをクリアする必要はありません。

私が何度も見たコーディングの間違いは、setInterval/setTimeout を使用するコードで、ハンドルが上書きされ、予期せず間隔が持続することです。このかなり鈍いコードを使用して作成されたときに間隔をキャプチャすることをお勧めします。

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

発火間隔のハンドルがハンドラに渡されるようにします。これにより、グローバルに保存する問題が回避されます。

于 2010-04-28T23:37:35.850 に答える