3

少し遅れて、mouseleave イベントでプルダウン メニューを閉じたいと思います。しかし、私はそれを機能させるのに問題があります。

オブジェクトで次のメソッドを検討してください: (私は jQuery を使用しています)

myObj = {};

myObj.message = "woot!";

myObj.bindEvents = function() {

        var that = this;

        $("#menuPanel")
            .bind("mouseleave", function() { 

                    that.timer = setTimeout(that.closeMenu,500); 

            });

    }

myObj.closeMenu = function() {

     // close the menu

     alert(this.message);

}

これはうまくいきません。つまり、this.message は undefined になります。少し掘り下げた後、その理由がわかりました。:) 「その」参照は、実行時に setTimeout 内のコードでは使用できません。

この種の問題を回避するための「最良の」方法は何ですか? setTimeout を使用するメソッドが同じオブジェクト内の別のメソッドを呼び出し、オブジェクト内のプロパティにアクセスできるようにするにはどうすればよいですか?

よろしくお願いします。

4

1 に答える 1

5

ここでの問題は、オブジェクトから closeMenu メソッドを切り離していることです。これを行うと、同じ問題が発生します。

var closeMenu = myObj.closeMenu;  // detaching the method from the object
closeMenu();

このようにメソッドをデタッチして呼び出すと、メソッドが作成されたオブジェクトには適用されなくなります。あなたの例では、ほぼ同じことをしています:

// Setting the first parameter of setTimeout to be the detached closeMenu method
that.timer = setTimeout(that.closeMenu,500);

最初の方法の修正は、callまたはapplyメソッドを使用することです。

var closeMenu = myObj.closeMenu;  // detaching the method from the object
closeMenu.apply(myObj);

しかし、それはタイマーには機能しません。代わりに、無名関数を作成します。

that.timer = setTimeout(function () { that.closeMenu(); },500);

また、言及する価値があるかもしれませんbind()-jQueryのものと混同しないでください$('#selector').bind()-しばらくの間、さまざまなブログやいくつかのライブラリ（Prototypeが最も注目されています）に浮かんでいて、最終的にECMAScriptエディション5で実装されたメソッド.

that.timer = setTimeout(that.closeMenu.bind(that),500);

私が作成した 1 つまたは 2 つのクラスで同様の方法を使用しています。

于 2010-02-21T13:12:28.687 に答える