0

そのため、ホバー時にドロップダウンナビゲーションが表示され、使いやすさを向上させるためにそこに遅延を設定しようとしています。もともと私は、IE8以下を除いてどこでも美しく機能するhoverIntentを使用していました。

その代わりに、私は単純な古いJavascriptで遅延を実行しようとしていますが、setTimeout関数は私のjQueryを呼び出しません。

var J = jQuery.noConflict（）;

 J(".navigation li").hover(function(){J(this).addClass("hover");},function(){setTimeout("J(this).removeClass('hover');",500);});

私がこのように設定したとき：

 function off(){J(this).removeClass("hover"); alert("hello");}


J(".navigation li").hover(function(){J(this).addClass("hover");},function(){setTimeout("off()",500);});

アラートは完全に機能しますが、.removeClass関数は機能しません。

私は何かが足りないのですか？

4

3 に答える 3

8

this内部setTimeoutはli要素ではありません。関数を受け取るsetTimeoutオーバーロードを使用することをお勧めします。変数を設定する前にthis、参照を保持します。

J(".navigation li").hover(function(){
   J(this).addClass("hover");
},
function(){
  var self = this;
  setTimeout(function() {
         J(self).removeClass('hover');
  },500);
});
于 2012-04-25T15:11:56.893 に答える
1

あなたのoff機能：

function off() {
    J(this).removeClass("hover");
    alert("hello")
}

thisによって呼び出されたときに適切な変数がありませんsetTimeout()-ほとんどの（すべての？）ブラウザthisでwindow。

thisオリジナルをラップしてそのタイマー関数に渡すには、追加のクロージャーが必要です。

J(".navigation li").hover(
    function() {
        J(this).addClass("hover");
    },
    function() {
        var that = this;
        setTimeout(function() {
            off.apply(that);
        }, 500);
    }
);

注意：文字列パラメータを使用しないでくださいsetTimeout()！

于 2012-04-25T15:11:56.917 に答える
0

問題はthis、timeout-callbackのスコープで別の何かを参照していることです。

最も簡単な解決策は、jQuery.proxy（[function]、[scope]）を使用して古いスコープを提供することです。

<html>
    <head>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
        <script>
            var f = function(){
                console.log(this.id);
            };

            $(function() {
                $("div").click(function () {
                    setTimeout($.proxy(f,this), 1000);
                });
            });
        </script>
    </head>
    <body>
        <div id="a">a</div>
        <div id="b">b</div>
    </body>
</html>
于 2012-04-25T15:18:39.543 に答える