0

私は現在、親要素が「入力された」ときに子要素でmousemoveイベントを使用するプラグインを開発しています

インスタンスが1つある場合は正常に機能しますが、ユーザーにインスタンスが多数ある場合はどうなりますか?

プラグインは画像を含むdivで使用され、カーソルに続くdivの中にdivがあります。

したがって、画像にカーソルを合わせると、divがカーソルの後に続きます。

mousemoveイベントがあまりにも多くの要素にバインドされていたためかもしれないと思ったので、'mouseleave'でmousemoveを元に戻しましたが、それでも問題は解決しません。

サファリとクロームで問題ないようです。

elem
.on('mouseenter', function(){

  $(this).on('mousemove', function(e){
     setPosition();
  });

})
.on('mouseleave', function(){

  $(this).unbind('mousemove');

});

setPosition()関数は、カーソル上のdivの位置を中央に設定するだけです。

プラグインが複数の要素で実行されている場合にのみ遅くなりますか?

助けてください、ありがとう。

4

2 に答える 2

0

バインドに使用する場合は、バインドを解除するためにon使用する必要があります。それはあなたの問題かもしれません。offunbind

于 2012-05-31T23:26:02.143 に答える
0

個々の要素にイベントハンドラーをアタッチするのではなく、包含要素でイベントを処理する必要があります。

例えば:

$('#parentDiv').on('mousemove', '#someDiv1, #someDiv2', function(event)
{
  // event.target is the div that triggered the mousemove event
  setPosition(event.target);
});

これは、要素ごとに1つのイベントハンドラーではなく、共通の親に1つのイベントハンドラーを作成していることを意味します(詳細については、google「jQueryイベント伝播」)。これにより、setPosition()メソッドが少し複雑になりますが、実装方法によっては、パフォーマンスが向上するはずです。

于 2012-05-31T23:53:53.023 に答える