From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- .../lostpointercapture_event/index.html | 103 +++++++++++++++++++++ 1 file changed, 103 insertions(+) create mode 100644 files/ja/web/api/htmlelement/lostpointercapture_event/index.html (limited to 'files/ja/web/api/htmlelement/lostpointercapture_event') diff --git a/files/ja/web/api/htmlelement/lostpointercapture_event/index.html b/files/ja/web/api/htmlelement/lostpointercapture_event/index.html new file mode 100644 index 0000000000..4491291c79 --- /dev/null +++ b/files/ja/web/api/htmlelement/lostpointercapture_event/index.html @@ -0,0 +1,103 @@ +--- +title: 'HTMLElement: lostpointercapture イベント' +slug: Web/API/HTMLElement/lostpointercapture_event +tags: + - DOM + - Event + - PointerEvent + - Reference +translation_of: Web/API/HTMLElement/lostpointercapture_event +--- +
{{APIRef}}
+ +

lostpointercapture イベントは、キャプチャされたポインタが解放されたときに発生します。

+ + + + + + + + + + + + + + + + + + + + +
バブリングなし
キャンセル不可
インターフェイス{{domxref("PointerEvent")}}
イベントハンドラプロパティonlostpointercapture
+ +

+ +

この例では、要素の lostpointercapture イベントをリッスンし、pointerdown で要素のポインタをキャプチャします。 その後ユーザーがポインタを離すと、lostpointercapture イベントが発生します。

+ +
const para = document.querySelector('p');
+
+para.addEventListener('lostpointercapture', () => {
+  console.log('解放された!')
+});
+
+para.addEventListener('pointerdown', (event) => {
+  para.setPointerCapture(event.pointerId);
+});
+
+ +

同じ例ですが、onlostpointercapture イベントハンドラプロパティを使用します。

+ +
const para = document.querySelector('p');
+
+para.onlostpointercapture = () => {
+  console.log('解放された!')
+};
+
+para.addEventListener('pointerdown', (event) => {
+  para.setPointerCapture(event.pointerId);
+});
+
+ +

仕様

+ + + + + + + + + + + + +
仕様状態
{{SpecName('Pointer Events', '#the-lostpointercapture-event')}}{{Spec2('Pointer Events')}}
+ +

ブラウザーの互換性

+ + + +

{{Compat("api.HTMLElement.lostpointercapture_event")}}

+ +

関連情報

+ + -- cgit v1.2.3-54-g00ecf