ホームページ > ウェブフロントエンド > jsチュートリアル > jQuery は、mouseDown マウス イベントと doubleClick マウス イベント間の実行競合の問題を解決します。

jQuery は、mouseDown マウス イベントと doubleClick マウス イベント間の実行競合の問題を解決します。

黄舟
リリース: 2017-06-28 09:29:11
オリジナル
3049 人が閲覧しました

まず、オブジェクトのmouseDownイベントとmouseDoubleClickイベントを監視する必要があります。この2つのイベントは、マウスを押すとドラッグ機能を実行し、マウスをダブルクリックするとスキル機能を解放します。しかし、ここで問題が発生します。何回クリックしても、最初にダウンがトリガーされなければなりません。

そこで専門家に聞いたところ、押下処理機能は 200ms 延期できるとのこと(ダブルクリックはおそらく 200ms 以内にカウントされるため) この 200ms の間にダブルクリックがあればダブルクリックが行われるとのこと。 clickイベントが最初に実行され、本来のダブルクリックイベントハンドラ関数はpressハンドラ関数と一緒にmouseDownに記述する必要があります。これを実行しましたが、やはりエラーが発生しました。なぜなら、押された機能の実行が延期されたとしても、押された機能は最終的には依然として実行されるからです (つまり、最初に元のダブルクリック イベントが実行され、次に 200 ミリ秒遅れて押された機能が実行されます)。

それで、問題は、ドラッグを実行しているのかリリースを実行しているのかを down 関数にどのように知らせるかということです。
これはデッドロック関数のようなものだと思います。1 つの関数が実行されると、そのオブジェクトの関数は実行できなくなります。ああ、一生懸命考えているのに、まだ分からない!

皆さんが熱心に方法を提供してくれましたが、私はそれらを一つ一つ試してみましたが、私のニーズを十分に説明していなかったせいかもしれません。ここで私がまとめたこの問題の考えられるフローチャートを提供します。 :

jQuery は、mouseDown マウス イベントと doubleClick マウス イベント間の実行競合の問題を解決します。

実際、これらは必ずしも相互排他的ではありません。結局のところ、市場に出回っている非常に多くの Web ゲーム バックパックがこれに対応しているからです...
アイデアを教えてください: UP のハンドラー関数で判断してください。イベントでは、マウスがまだバックパック内にある場合、セカンダリ メニュー がポップアップします。マウスがバックパック内にない場合は、ドラッグ アンド ドロップ操作になります。

doubleClickEnabled = true; ダブルクリックするオブジェクトが true に設定されている場合にのみ、マウスのダブルクリック イベントが聞こえ、2 回のクリック間の時間によってシングルクリック イベントとダブルクリック イベントが区別されます。が非常に小さい場合、ダブルクリックとみなされます
これを見逃した場合は確認してください

ドラッグには、クリックに加えて、クリック後にマウスが移動するというもう 1 つの特徴があります。
以下の条件を満たす場合に「リリース」と判断します。
ドラッグ中のオブジェクトがあり、マウスを1回クリックし、300ms以内に再度マウスをクリックし、2回目のクリックの位置が1回目のクリックの位置と同じである場合に「リリース」と判断します。クリック 差は 5 ピクセル未満 (手のスライド誤差)

その他の 動作、
は、既にドラッグされているオブジェクトが存在するかどうかに基づいて
「ドラッグ」
または
「無効な操作」と判断されます

あなたの専門家は正しいですあ、mouseDown取得後に遅延を与えた場合、2回目のmouseDownイベントは
200ms以内に解放され、遅延されたドラッグイベントはキャンセルされます。その後、2回目のmouseDownイベントは受信されず、200ms以降mouseUpイベントは受信されません。ドロップ;

これを行う必要はありません
オブジェクトの境界線はドラッグ イベントにのみ応答します
オブジェクトの中央はリリース イベントにのみ応答します

または、オブジェクトをインターフェイスの外に移動すると、オブジェクトが解放されます。 。 。
お客様がしつこい場合は、私たちにできることは何もありません

package
{
import flash.display.Sprite;
import flash.events.Event;
import flash.events.MouseEvent;

/**
* ...
* @author 小松626
*/
public class Main extends Sprite
{
private var _mc:Sprite;
private var date2Time:Number;
private var date1:Date;
private var date1Time:Number;
private var date2:Date;

public function Main():void
{
if (stage)
init();
else
addEventListener(Event.ADDED_TO_STAGE, init);
}

private function init(e:Event = null):void
{
removeEventListener(Event.ADDED_TO_STAGE, init);
// entry point
creatMc();
_mc.addEventListener(MouseEvent.MOUSE_DOWN, dragMouseDownHandler);
}

private function creatMc():void 
{
_mc = new Sprite();
_mc.graphics.beginFill(0xff0000);
_mc.graphics.drawCircle(0, 0, 20);
_mc.graphics.endFill();
addChild(_mc);
_mc.x = 50;
_mc.y = 50;
}

private function dragMouseDownHandler(e:MouseEvent):void
{
_mc.startDrag(false); 
date1 = new Date();
date1Time = date1.time;
stage.addEventListener(MouseEvent.MOUSE_UP, dragMouseUpHandler); //鼠标抬起侦听事件
}

/*
* 鼠标抬起侦听事件函数
*/
private function dragMouseUpHandler(e:MouseEvent):void
{
stage.removeEventListener(MouseEvent.MOUSE_UP, dragMouseUpHandler); //鼠标抬起侦听事件(移除) 
date2 = new Date();
date2Time = date2.time;
if (date2Time - date1Time > 100)
{
_mc.stopDrag(); //停止拖拽
}
else
{
_mc.doubleClickEnabled = true;
_mc.addEventListener(MouseEvent.DOUBLE_CLICK, mcDoubleClickHandler);
}
}

private function mcDoubleClickHandler(e:MouseEvent):void 
{
trace("双击mc");
}

}

}
ログイン後にコピー

ダブルクリックが発生したかどうかを示す真偽の判定を追加します。ダブルクリックが発生したばかりの場合 (ダブルクリック イベントが発生したときに true に設定します)、元のスタンドアロン関数は 200 ミリ秒後に実行されず、変数は flase にリセットされるだけです。

以上がjQuery は、mouseDown マウス イベントと doubleClick マウス イベント間の実行競合の問題を解決します。の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート